Skip to content

Instantly share code, notes, and snippets.

View kettanaito's full-sized avatar
🚀
Extremely busy. Open source activity paused.

Artem Zakharchenko kettanaito

🚀
Extremely busy. Open source activity paused.
View GitHub Profile
@kettanaito
kettanaito / client-App.jsx
Last active April 21, 2023 22:16
React - SSR (Server-side rendering)
// Root of the actual application.
// Feel free to branch from here, create routes and any other things
// rendered on both browser and server.
//
// Don't use modules relying on "window" here, as it would throw on the serfver.
// If using any such logic, move it to "client-index" instead, as its being rendered
// in the browser only.
import React from 'react'
const App = () => (
class Guitar {
constructor(args) {
this.name = args.name;
this.stringsCount = args.stringsCount || 6;
}
play() {
console.log("lalala");
}
}
@kettanaito
kettanaito / app.js
Created July 20, 2019 17:34
Webpack server HMR issue
import express from 'express'
const app = express()
app.use((req, res, next) => {
console.log('ping')
next()
})
export default app
@kettanaito
kettanaito / Component.js
Last active August 28, 2019 10:03
Redux action after GraphQL query (Apollo)
import React from 'react'
import { connect } from 'react-redux'
import { useQuery } from '@apollo/react-hooks'
import reduxAction from './path/to/redux/action'
const MY_QUERY = gql`
...
`
const Component = () => {
@kettanaito
kettanaito / myFunc.ts
Created September 4, 2019 17:42
Thinking in Functions – The Input/Output pattern
function myFunc(list: number[]): string {}
@kettanaito
kettanaito / functionalChain.ts
Created September 4, 2019 18:04
Thinking in Functions — The Input/Output pattern
const getUser = (id: string) => User
const getPosts = (user: User) => Post[]
const getTotalLikes = (posts: Post[]) => number
// getUser -> getPosts -> getTotalLikes
@kettanaito
kettanaito / myFunc.test.ts
Created September 4, 2019 18:35
Thinking in Functions — The Input/Output pattern
expect(myFunc(['a', 'b']).toEqual(2)
@kettanaito
kettanaito / perspective-tilt.css
Created September 21, 2019 13:23
Tilt (translate) an element in perspective
body {
-webkit-perspective: 1000px;
}
#style-text {
-webkit-transform: translateX(98.5%) rotateY(-10deg);
-webkit-transform-origin: right;
max-height: 94.5%;
}
@kettanaito
kettanaito / changelog.md
Created September 22, 2019 12:13
Unified Change Log Format

1.0.0

@kettanaito
kettanaito / debounce.js
Last active December 19, 2019 15:01
Debounce
function debounce(func, duration) {
let timeout
return (...args) => {
const effect = () => {
timeout = null
return func(...args)
}
clearTimeout(timeout)