Skip to content

Instantly share code, notes, and snippets.

View devpato's full-sized avatar
🕺
dancing at the rhythm of typing

Pato devpato

🕺
dancing at the rhythm of typing
386 followers · 551 following
View GitHub Profile
@slikts
slikts / advanced-memo.md
Last active April 27, 2024 02:40
Advanced memoization and effects in React

nelabs.dev

Advanced memoization and effects in React

Memoization is a somewhat fraught topic in the React world, meaning that it's easy to go wrong with it, for example, by [making memo() do nothing][memo-pitfall] by passing in children to a component. The general advice is to avoid memoization until the profiler tells you to optimize, but not all use cases are general, and even in the general use case you can find tricky nuances.

Discussing this topic requires some groundwork about the technical terms, and I'm placing these in once place so that it's easy to skim and skip over:

  • Memoization means caching the output based on the input; in the case of functions, it means caching the return value based on the arguments.
  • Values and references are unfortunately overloaded terms that can refer to the low-level implementation details of assignments in a language like C++, for example, or to memory
@tatianamac
tatianamac / tatiana-mac-speaker-rider.md
Last active March 24, 2024 12:22
Tatiana Mac's Speaker Rider

Speaker Rider

by Tatiana Mac

Last updated 14 April 2021

What is a speaker rider?

As speaking comes with immense privilege, I have crafted a speaker rider to set expectations and boundaries around my engagement. I am grateful to all the conference organisers who have brilliantly hosted me. I would love to continue to exercise this privilege to speak at conferences, and use this privilege to make the landscape more accessible and beneficial to tech's most historically excluded and marginalised communities.

Considerations

😫 I provide a lot of explanations for those of you who never had to consider these things. Most thoughtful conferences I've attended check most of these boxes intrinsically, particularly when conference runners are experienced speakers. They get it.

@PsyGik
PsyGik / onesingal.service.ts
Created November 24, 2018 06:49
OneSignal Angular TypeScript
import {Injectable} from '@angular/core';
import {Cache} from '../utils/storage.provider'; // Decorator to access local storage
let OneSignal;
const url = '';
@Injectable()
export class OneSignalService {
@Cache({pool: 'OneSignal'}) oneSignalInit; // to check if OneSignal is already initialized.
@JamieMason
JamieMason / group-objects-by-property.md
Created September 14, 2018 07:38
Group Array of JavaScript Objects by Key or Property Value

Group Array of JavaScript Objects by Key or Property Value

Implementation

const groupBy = key => array =>
  array.reduce((objectsByKeyValue, obj) => {
    const value = obj[key];
    objectsByKeyValue[value] = (objectsByKeyValue[value] || []).concat(obj);
    return objectsByKeyValue;
@bakoushin
bakoushin / sw-await.js
Created February 1, 2018 08:12
Service Worker: Promises vs Async/Await
const version = 1;
const appPrefix = 'myApp-';
const staticCacheName = appPrefix + 'static-v' + version;
const imagesCacheName = appPrefix + 'content-imgs';
var allCaches = [
staticCacheName,
imagesCacheName
];
self.addEventListener('message', event => {
@peterbsmyth
peterbsmyth / recipe.example.md
Last active May 21, 2020 13:39
Making chained API Calls using @ngrx/Effects

Making chained API Calls using @ngrx/Effects

Purpose

This recipe is useful for cooking up chained API calls as a result of a single action.

Description

In the below example, a single action called POST_REPO is dispatched and it's intention is to create a new repostiory on GitHub then update the README with new data after it is created.
For this to happen there are 4 API calls necessary to the GitHub API:

  1. POST a new repostiry
  2. GET the master branch of the new repository
  3. GET the files on the master branch
@slavafomin
slavafomin / 0-README.md
Last active March 15, 2023 13:35
Angular 2 match other field validator / Password match validator

Angular 2 match other field validator

This custom validator for Angular 4 allows you to have fields that must be equal to some other fields. Such validator is very useful for password confirmation validation, for example.

Besides checking if two values are matching, it also subscribes to changes from other control and re-validates when either of two controls is updated.

Usage




  


  




    


          
    

      

        
        

          

              @raphaellondner-mongodb
          

          

            
                raphaellondner-mongodb
                / lambda-mongodb-example
            
            

              Last active
              March 11, 2020 02:37
            

              
                MongoDB-Lambda-Example
              
          

        

      

        

  

    
    


        



  


  

        

          
          'use strict'
        

        

          
          const AWS = require('aws-sdk');
        

        

          
          var MongoClient = require('mongodb').MongoClient;
        

        

          
          

        

        

          
          let atlas_connection_uri;
        

        

          
          

        

        

          
          exports.handler = (event, context, callback) => {
        

        

          
              var uri = process.env['MONGODB_ATLAS_CLUSTER_URI'];
        

        

          
              
        

        

          
              if (atlas_connection_uri != null) {
        

  





    


  




    


          
    

      

        
        

          

              @basicavisual
          

          

            
                basicavisual
                / index.html
            
            

              Created
              December 5, 2015 18:29
            

              
                Mexico GeoJson demo
              
          

        

      

        

  

    
    


        



  


  

        

          
          <!DOCTYPE html>
        

        

          
          <html>
        

        

          
            <head>
        

        

          
              <meta charset="utf-8">
        

        

          
              <title>Entidades mexicanas.</title>
        

        

          
              <script type="text/javascript" src="http://d3js.org/d3.v3.js"></script>
        

        

          
              <style type="text/css">
        

        

          
              body {
        

        

          
                margin: 0;
        

        

          
                background-color:  #2B2B2B;
        

  





    


  




    


          
    

      

        
        

          

              @staltz
          

          

            
                staltz
                / introrx.md
            
            

              Last active
              May 24, 2024 07:56
            

              
                The introduction to Reactive Programming you've been missing