-
Create a fresh new Next js project. https://nextjs.org/docs/getting-started#automatic-setup
pnpm create next-app --typescript
-
install prettier
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
/* | |
Copy this into the console of any web page that is interactive and doesn't | |
do hard reloads. You will hear your DOM changes as different pitches of | |
audio. | |
I have found this interesting for debugging, but also fun to hear web pages | |
render like UIs do in movies. | |
*/ | |
const audioCtx = new (window.AudioContext || window.webkitAudioContext)() |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
// Inspired by https://twitter.com/coderitual/status/1112297299307384833 and https://tapajyoti-bose.medium.com/7-killer-one-liners-in-javascript-33db6798f5bf | |
// Remove any duplicates from an array of primitives. | |
const unique = [...new Set(arr)] | |
// Sleep in async functions. Use: await sleep(2000). | |
const sleep = (ms) => (new Promise(resolve => setTimeout(resolve, ms))); | |
// or | |
const sleep = util.promisify(setTimeout); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
import React from 'react' | |
import styled from 'styled-components' | |
class ScrollingWrapper extends React.Component { | |
state = { hasScrolled: false } | |
componentDidMount() { | |
this.scrollingWrapper.addEventListener('scroll', this.onScroll) | |
} |
I've been deceiving you all. I had you believe that Svelte was a UI framework — unlike React and Vue etc, because it shifts work out of the client and into the compiler, but a framework nonetheless.
But that's not exactly accurate. In my defense, I didn't realise it myself until very recently. But with Svelte 3 around the corner, it's time to come clean about what Svelte really is.
Svelte is a language.
Specifically, Svelte is an attempt to answer a question that many people have asked, and a few have answered: what would it look like if we had a language for describing reactive user interfaces?
A few projects that have answered this question:
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
#!/bin/bash | |
set -e | |
set -u | |
clear | |
ami="ami-10e00b6d" | |
size="t2.medium" | |
today=$(date +"%m-%d-%y-%H%M") | |
localip=$(curl -s https://ipinfo.io/ip) |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
/** | |
* Why is this here you ask? React Native doesn't use Webpack. True. This file is here to trick | |
* IDEA in recognizing module aliases (see the package.json files in some of the subdirs). | |
* Nice solution? No. Does it work? Sure. | |
* Tracker URL: https://youtrack.jetbrains.com/issue/WEB-23221 | |
* | |
* - TS | |
*/ | |
const fs = require('fs') |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
/* -------------------------------------------------------------------------- */ | |
// All Bootstrap 4 Sass Mixins [Cheat sheet] | |
// Updated to Bootstrap v4.5.x | |
// @author https://anschaef.de | |
// @see https://github.com/twbs/bootstrap/tree/master/scss/mixins | |
/* -------------------------------------------------------------------------- */ | |
/* | |
// ########################################################################## */ | |
// New cheat sheet for Bootstrap 5: |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
--- | |
format_version: 1.1.0 | |
default_step_lib_source: https://github.com/bitrise-io/bitrise-steplib.git | |
trigger_map: | |
- push_branch: "*" | |
workflow: tests | |
workflows: | |
_tests_setup: | |
steps: | |
- activate-ssh-key: {} |
- http://stackoverflow.com/questions/804115 (
rebase
vsmerge
). - https://www.atlassian.com/git/tutorials/merging-vs-rebasing (
rebase
vsmerge
) - https://www.atlassian.com/git/tutorials/undoing-changes/ (
reset
vscheckout
vsrevert
) - http://stackoverflow.com/questions/2221658 (HEAD^ vs HEAD~) (See
git rev-parse
) - http://stackoverflow.com/questions/292357 (
pull
vsfetch
) - http://stackoverflow.com/questions/39651 (
stash
vsbranch
) - http://stackoverflow.com/questions/8358035 (
reset
vscheckout
vsrevert
)
NewerOlder