Skip to content

Instantly share code, notes, and snippets.

View gabrielmlinassi's full-sized avatar
🏠
Working from home

Gabriel Marmitt gabrielmlinassi

🏠
Working from home
View GitHub Profile
@gabrielmlinassi
gabrielmlinassi / snippet.js
Created July 19, 2022 02:48
How to implement debounce
// #1. With a controlled input
import { useState, useEffect } from 'react';
const debounce = require("lodash.debounce");
function SearchBar({ onSearch, wait = 500 }) {
const [value, setValue] = useState('');
const [searchTerm, setSearchTerm] = useState('');
useEffect(() => {
onSearch && onSearch(searchTerm);
@jmaicaaan
jmaicaaan / try-catch-snippet-03.js
Created March 31, 2021 13:25
[Tutorial] Functional try catch
const getData = (id) => {
if (!id) {
throw new Error('No id found');
}
return [1, 2, 3, 4, 5].filter(i => i % id);
};
const tryCatch = (tryer) => {
try {
@reinvanoyen
reinvanoyen / terminal-prompt-git-branch-zsh.md
Last active June 25, 2024 05:27
Add Git Branch Name to Terminal Prompt (MacOS zsh)

Add Git Branch Name to Terminal Prompt (zsh)

Updated for MacOS with zsh

  • Catalina
  • Big Sur
  • Monterey
  • Ventura
  • Sonoma

screenshot

@BretCameron
BretCameron / fp.js
Created October 14, 2019 19:08
An example of functional programming in JavaScript, featuring compose, pipe, tap and trace functions
/**
* Performs right-to-left composition, combining multiple functions into a single function.
* @function compose
* @param {...Function} args
* @returns {Function}
*/
const compose = (...fns) => x => fns.reduceRight((output, fn) => fn(output), x, fns);
/**
* Performs left-to-right composition, combining multiple functions into a single function. Sometimes called `sequence`. Right-to-left composition is typically known as `compose`.
// These two are equivalent
!A && !B == !(A || B)
// Also these two
!A || !B == !(A && B)
@rosario
rosario / composing-software.md
Created January 17, 2018 16:13 — forked from Geoff-Ford/composing-software.md
Eric Elliott's Composing Software Series
@alirezas
alirezas / fade.js
Created February 13, 2017 10:54
fadeIn & fadeOut in vanilla js
function fadeOut(el){
el.style.opacity = 1;
(function fade() {
if ((el.style.opacity -= .1) < 0) {
el.style.display = "none";
} else {
requestAnimationFrame(fade);
}
})();
@matt-bailey
matt-bailey / async-and-conditional-css-loading.html
Last active March 17, 2021 22:09
A simple script (based on one by Google) for loading CSS files asynchronously and conditionally based on body tag classes
<html>
<head>
<!-- Inlined critical styles -->
<style>.blue{color:blue;}</style>
<!-- CSS loader -->
<script>
/* ==========================================================================
Load CSS asynchronously and conditionally after initial painting

#Understanding MVC And MVP (For JavaScript & Backbone Developers)

Before exploring any JavaScript frameworks that assist in structuring applications, it can be useful to gain a basic understanding of architectural design patterns. Design patterns are proven solutions to common development problems and can suggest structural paradigms to help guide us in adding some organization to our application.

I think patterns are exciting as they're effectively a grass roots effort that build upon the collective experience of skilled developers who have previously faced similar problems as we do now. Although developers 10 or 20 years ago may not have been using the same programming languages for implementing patterns, there are many lessons we can learn from their efforts.

In this section, we're going to review two popular patterns - MVC and MVP. The context of our exploration will be how these patterns are related to the popular JavaScript framework Backbone.js, which will be explored in greater detail later on.