Skip to content

Instantly share code, notes, and snippets.

@jgthms
jgthms / useeffect_abort.js
Created July 22, 2022 08:16 — forked from bartcis/useeffect_abort.js
Abort signal on initial fetch of API
export const Articles = () => {
const [state, setState] = useState([]);
useEffect(() => {
const abortController = new AbortController();
const {signal} = abortController;
const apiCall = async path => {
try {
const request = await fetch(path, {
@jgthms
jgthms / fetch_hook.js
Created July 22, 2022 08:16 — forked from bartcis/fetch_hook.js
Fetch from API as custom Hook
import {compile} from 'path-to-regexp';
import {GET_ARTICLE_PATH} from './articles-routes';
export const useGetSingleArticle = ({ articleId, abortController = new AbortController()}) => {
const baseUrl = 'https://jsonplaceholder.typicode.com';
const path = baseUrl + compile(GET_ARTICLE_PATH)({articleId});
const { signal, abort } = abortController || {};
const articleRequest = fetch(path, {
signal: signal,
method: 'GET',
const [articleId, setArticleId] = useState(2);
const [articleRequest, abortArticleRequest] = useGetSingleArticle({articleId: articleId});
const abortFuncs = useRef([]);
@jgthms
jgthms / fetchOnClick.js
Created July 22, 2022 08:15 — forked from bartcis/fetchOnClick.js
Function to fetch and update abort functions
const fetchOnClick = async () => {
try {
abortFuncs.current.unshift(abortArticleRequest);
const newArticleRequest = await articleRequest;
const newArticle = await newArticleRequest.json();
setState([...state, newArticle]);
setArticleId(articleId +1);
} catch(e) {
@jgthms
jgthms / abort-signals-ondestory.js
Created July 22, 2022 08:15 — forked from bartcis/abort-signals-ondestory.js
Example aborting of multiple signals on destroy
useEffect(() => {
const abortController = new AbortController();
const {signal} = abortController;
const apiCall = async path => {
try {
const request = await fetch(path, {
signal: signal,
method: 'GET',
});
// How to persist the React Redux state store to the browser's localStorage
// Code taken from Dan Abramov's video
// https://egghead.io/lessons/javascript-redux-persisting-the-state-to-the-local-storage
/**
localStorage.js
*/
export const loadState = () => {
try {
const serializedState = localStorage.getItem('state');
@jgthms
jgthms / git-deployment.md
Created October 27, 2019 17:27 — forked from noelboss/git-deployment.md
Simple automated GIT Deployment using Hooks

Simple automated GIT Deployment using GIT Hooks

Here are the simple steps needed to create a deployment from your local GIT repository to a server based on this in-depth tutorial.

How it works

You are developing in a working-copy on your local machine, lets say on the master branch. Most of the time, people would push code to a remote server like github.com or gitlab.com and pull or export it to a production server. Or you use a service like deepl.io to act upon a Web-Hook that's triggered that service.

@jgthms
jgthms / pure_html_css_modal.css
Created June 12, 2019 17:22 — forked from calebporzio/pure_html_css_modal.css
The CSS for the pure HTML/CSS modal I tweeted about.
details summary {
cursor: pointer;
outline: none !important;
display: inline-block;
padding: 8px 12px;
padding-top: 10px;
border-radius: 4px;
overflow: hidden;
background: #F09825;
color: white;
@jgthms
jgthms / srt.tcl
Created December 27, 2017 09:16 — forked from antirez/srt.tcl
stretch / sync an SRT subtitle file to exactly match your video file.
# Quick hack to stretch the .srt subtitles to match the one of your video.
# Check the time of the first and last sentence in your video file, then
# use this tool to convert the .srt file into one matching your video with:
#
# tclsh srt.tcl file.srt <your start time> <your end time> > output.srt
#
# Example:
#
# tclsh srt.tcl my.srt 00:00:24,000 00:44:15,000 > ~/Desktop/new.srt
#
#!/usr/bin/env ruby
#
# Ruby script to download a number of files
# from individual URLs via HTTP/HTTPS/FTP
# specified in an external file.
#
# Author: Tobias Preuss
# Revision: 2013-04-18 16:26 +0100 UTC
# License: Creative Commons Attribution-ShareAlike 3.0 Unported