Skip to content

Instantly share code, notes, and snippets.

View luismartinezs's full-sized avatar
😄
Always learning

Luis Martinez Suarez luismartinezs

😄
Always learning
29 followers · 49 following
View GitHub Profile
@luismartinezs
luismartinezs / shuffleArray.js
Last active June 18, 2021 07:59
Shuffle array #js
function shuffleArray(array) {
var m = array.length, t, i;
while (m) {
i = Math.floor(Math.random() * m--);
t = array[m];
array[m] = array[i];
array[i] = t;
}
@luismartinezs
luismartinezs / redux-basic-pattern.js
Created November 29, 2018 09:28
Redux basic pattern #redux
// state:
const state = {
todos: [{
text: 'Eat food',
completed: true
}, {
text: 'Exercise',
completed: false
}],
visibilityFilter: 'SHOW_COMPLETED'
@luismartinezs
luismartinezs / helper.css
Last active June 18, 2021 07:58
Helper CSS classes #css
/* HELPER CLASSES */
.d-flex {
display: flex;
}
.d-col {
flex-direction: column;
}
@luismartinezs
luismartinezs / asyncFetch.js
Last active June 18, 2021 07:57
Async Call template #js
async function asyncCall(url) {
return fetch(url)
.then(response => response.json())
.then(responseJson => {
return responseJson;
})
.catch(error => {
throw error;
});
}
@luismartinezs
luismartinezs / _theme.scss
Created December 29, 2018 22:42
SCSS theming template #scss
$font-h: "Raleway", sans-serif;
$font-p: "Open Sans", sans-serif;
$hue-primary: 151.9;
$hue-secondary: 19.4;
$primary: hsl($hue-primary, 86%, 36.5%);
$primary-light: hsl($hue-primary, 47.7%, 58%);
$primary-xlight: hsl($hue-primary, 51.7%, 82.9%);
$primary-dark: hsl($hue-primary, 97.8%, 17.5%);
$secondary: hsl($hue-secondary, 100%, 48%);
$secondary-light: hsl($hue-secondary, 100%, 69.6%);
@luismartinezs
luismartinezs / projects.json
Last active February 8, 2019 08:17
Portfolio source data
[
{
"id": "01",
"title": "React ecommerce template",
"description": "3 page ecommerce site including home page, detail page and shopping cart. Shopping cart and price dynamically populated. Product data are fetched from external API (https://ghibliapi.herokuapp.com/). Project done with React and Redux.",
"img": "ecommerce-template-thumbnail.jpg"
},
{
"id": "02",
"title": "Heatmap d3 plot",
@luismartinezs
luismartinezs / size-and-scrolling.js
Created February 23, 2019 19:43
elem size and scroll #jsdom
// I never remember what properties define the size of element, window and page. Let this serve as a quick reference.
// For detailed info look at: http://javascript.info/size-and-scroll and http://javascript.info/size-and-scroll-window
// DOM ELEMENTS
// OFFSET: size of the element WITH padding, border and scrollbar
// CLIENT: size of the element WITHOUT padding, border or scrollbar
// SCROLL: equivalent to SCROLL but including also scrolled out (not visible) area
// TOP/LEFT propeties: the width of the space outside the sizing boundary and the next sizing boundary
// ELEM SIZES
@luismartinezs
luismartinezs / checkStatusCode.js
Created February 23, 2019 20:56
Check status code of API response #js #http
// Status codes reference: https://www.restapitutorial.com/httpstatuscodes.html
// Use something like this when fetching from an external resource, to process the response
const checkStatusCode = response => {
if (response.status >= 200 && response.status < 400) {
return response;
}
if (response.status === 401) {
throw new Error('Unauthorized to use the api!');
}
@luismartinezs
luismartinezs / server.js
Created February 23, 2019 21:13
Nodejs custom middlewares #nodejs
// Middlewares created while learning nodejs/express
const express = require('express');
const fs = require('fs');
const path = require('path');
require('dotenv').config();
const app = express();
@luismartinezs
luismartinezs / flexbox-tests.html
Created September 3, 2019 08:17
Test how flex css works #css #flex
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<meta http-equiv="X-UA-Compatible" content="ie=edge" />
<title>Document</title>
<style>
.flex-container {
padding: 0;