Skip to content

Instantly share code, notes, and snippets.

View volkancakil's full-sized avatar
Trying to quit vim

Volkan Çakıl volkancakil

Trying to quit vim
  • Antalya, Turkey
View GitHub Profile
emilong / component.jsx
Created May 27, 2016 20:35
Creating semantic links for react-router using HOCs
import React, { Component } from 'react'
import { SubWidgetLink } from './routes'
export default class MyComponentWithALink extends Component {
render() {
const { widget } = this.props
return (
aldendaniels /
Last active October 6, 2018 09:50
Alternative to Higher-order Components

React now supports the use of ES6 classes as an alternative to React.createClass().

React's concept of Mixins, however, doesn't have a corollary when using ES6 classes. This left the community without an established pattern for code that both handles cross-cutting concerns and requires access to Component Life Cycle Methods.

In this gist, @sebmarkbage proposed an alternative pattern to React mixins: decorate components with a wrapping "higher order" component that handles whatever lifecycle methods it needs to and then invokes the wrapped component in its render() method, passing through props.

While a viable solution, this has a few drawbacks:

  1. There's no way for the child component to override functionality defined on the higher order component.
evantahler / buildSitemap.js
Last active December 17, 2020 16:35
35 lines to build a sitemap for next.js projects
#! /usr/bin/env node
// I am ./bin/buildSitemap.js
const path = require('path')
const glob = require('glob')
const fs = require('fs')
const SITE_ROOT = process.env.SITE_ROOT || ''
const SOURCE = process.env.SOURCE || path.join(__dirname, '..', 'pages', '/**/*.js')
const DESTINATION = process.env.DESTINATION || path.join(__dirname, '..', 'static', 'sitemap.xml')
regilero / nginx.conf
Last active February 26, 2021 12:22 — forked from thoop/nginx.conf
Altered nginx.conf for nginx
# Change YOUR_TOKEN to your prerender token and uncomment that line if you want to cache urls and view crawl stats
# Change (server_name) to your website url
# Change /path/to/your/root to the correct value
# Generate $prerender_ua bool value based on user agent
# indexation bots will get this as 1,
# prerender user agent will always get 0 (avoid loops)
map $http_user_agent $prerender_ua {
default 0;
donaldpipowitch /
Last active April 2, 2022 01:35
Example for a codemod which can run on a TypeScript code base

Install @codemod/cli globally:

$ npm install -g @codemod/cli
# or
$ yarn global add @codemod/cli

This package works out of the box with most code bases, because it comes bundled with @babel/preset-env and @babel/preset-typescript. If you need other presets or plugins for parsing your source code you can use a custom Babel config as well. Note that the codemod will not apply the transformations from these presets and plugins - they are only used for parsing. Therefor you keep your TypeScript types in your source code for example. Formatting will be kept the same as much as possible.

yyx990803 / exampe-config.js
Created January 13, 2021 02:58
A vite plugin that loads the specified deps over CDN during dev, and downloads/includes them into bundle during build.
// example vite.config.js
import { cdn } from './vite-plugin-cdn'
export default {
plugins: [
// also supported:, jspm
// loads the dep over the CDN during dev
// auto downloads and includes into the bundle during build
cdn('skypack', {
vue: '^3.0.5'
anuraghazra /
Last active March 21, 2023 21:06
TypeScript TokenizeTheme type performance

In these two files if you change getToken{slow,fast}'s passed value (just add a random letter anywhere) you'll see that the fast version is getting type checked about 3x to 5x faster than the slow one.

I'm not sure why using key remapping and using keyof {} is about 3x to 5x faster when doing type checking.

My guess is that in the slow version is using index access with the {}[keyof Theme] which is generally slower?

davidfowl / Example.cs
Last active June 6, 2023 08:10
An implementation of MessagePipe. Something like a channel but with buffer management so you can peek and advance the message that was read.
using System.Buffers;
using System.Net.WebSockets;
var builder = WebApplication.CreateBuilder(args);
var app = builder.Build();
app.MapGet("/ws", async (HttpContext context) =>
const int MaxMessageSize = 1024 * 1024;
terjanq /
Last active October 4, 2023 10:36
Postviewer challenge writeup from GoogleCTF 2022

Postviewer - writeup

Challenge's overview

The rumor tells that adm1n stores their secret split into multiple documents. Can you catch 'em all?

The challenge consisted of an all client-side simple page, i.e. no backend code was involved. A user can upload any file which will be then locally stored in indexedDB. They can preview their files by either clicking on the title or by visiting file's URL, for example The preview of the file is rendered inside a blob created from data: URL. The rendering occurs by sending file's contents to the iframe via postMessage({ body, mimeType }, '*')

Additionally, there is a /bot endpoint which lets players send URLs to an xss-bot imitating another user. The goal is to steal their documents.

rikschennink / nudgeable.ts
Last active October 22, 2023 05:53
⌨️ A Svelte action to add arrow key interaction to an element
export default (element: HTMLElement, options: any = {}) => {
// if added as action on non focusable element you should add tabindex=0 attribute
const {
direction = undefined,
shiftMultiplier = 10,
bubbles = false,
stopKeydownPropagation = true,
} = options;