Skip to content

Instantly share code, notes, and snippets.

View 1kvsn's full-sized avatar
🏠
Working from home

Sasikant 1kvsn

🏠
Working from home
View GitHub Profile
@gaearon
gaearon / index.html
Last active August 2, 2024 18:06
Multiple React components on a single HTML page
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8" />
<title>Add React in One Minute</title>
</head>
<body>
<h2>Add React in One Minute</h2>
<p>This page demonstrates using React with no build tooling.</p>
@jiaozhu
jiaozhu / iterm2_badges.md
Created June 23, 2018 05:52 — forked from criaturaExperimental/iterm2_badges.md
Customizing badges for iTerm2

Customizing iTerm badges

There are two variables available to use in the badge field with

\(user.gitBranch) \n \(user.humpDay)
  • gitBranch shows the current branch the folder opened in the terminal is
  • humpDay shows an icon according to the date

This code goes into ~/.bash_profile

@gaearon
gaearon / modern_js.md
Last active October 25, 2024 06:12
Modern JavaScript in React Documentation

If you haven’t worked with JavaScript in the last few years, these three points should give you enough knowledge to feel comfortable reading the React documentation:

  • We define variables with let and const statements. For the purposes of the React documentation, you can consider them equivalent to var.
  • We use the class keyword to define JavaScript classes. There are two things worth remembering about them. Firstly, unlike with objects, you don't need to put commas between class method definitions. Secondly, unlike many other languages with classes, in JavaScript the value of this in a method [depends on how it is called](https://developer.mozilla.org/en-US/docs/Web/Jav
// Place your settings in this file to overwrite the default settings
{
"breadcrumbs.enabled": true,
"editor.acceptSuggestionOnEnter": "on",
"editor.detectIndentation": false,
"editor.fontFamily": "'Source Code Pro', Menlo, Consolas, Courier, monospace",
"editor.fontSize": 11,
"editor.formatOnSave": true,
"editor.multiCursorModifier": "ctrlCmd",
"editor.quickSuggestions": {
{
/*
// Place your snippets for HTML here. Each snippet is defined under a snippet name and has a prefix, body and
// description. The prefix is what is used to trigger the snippet and the body will be expanded and inserted. Possible variables are:
// ${1}, ${2} for tab stops, ${0} for the final cursor position, and ${1:label}, ${2:another} for placeholders. Placeholders with the
// same ids are connected.
// Example:
"Print to console": {
"prefix": "log",
"body": [
@gokulkrishh
gokulkrishh / media-query.css
Last active November 10, 2024 02:00
CSS Media Queries for Desktop, Tablet, Mobile.
/*
##Device = Desktops
##Screen = 1281px to higher resolution desktops
*/
@media (min-width: 1281px) {
/* CSS */
@tlrobinson
tlrobinson / redux-devtools-separate-window.js
Last active August 20, 2019 23:54
Put the awesome redux-devtools in it's own window so it doesn't obscure or be obscured by your application
// give it a name so it reuses the same window
var win = window.open(null, "redux-devtools", "menubar=no,location=no,resizable=yes,scrollbars=no,status=no");
// reload in case it's reusing the same window with the old content
win.location.reload();
// wait a little bit for it to reload, then render
setTimeout(function() {
React.render(
<DebugPanel top right bottom left >
@gaearon
gaearon / ReduxMicroBoilerplate.js
Last active March 26, 2020 00:35
Super minimal React + Redux app
import React, { Component } from 'react';
import { createStore, combineReducers, applyMiddleware, bindActionCreators } from 'redux';
import { provide, connect } from 'react-redux';
import thunk from 'redux-thunk';
const AVAILABLE_SUBREDDITS = ['apple', 'pics'];
// ------------
// reducers
// ------------
@max-mapper
max-mapper / 0.md
Last active February 25, 2024 12:24
JS hoisting by example

JavaScript function hoisting by example

Below are many examples of function hoisting behavior in JavaScript. Ones marked as works successfuly print 'hi!' without errors.

To play around with these examples (recommended) clone them with git and execute them with e.g. node a.js

Notes on hoisting

(I may be using incorrect terms below, please forgive me)

@sebmarkbage
sebmarkbage / react-terminology.md
Last active January 9, 2023 22:47
React (Virtual) DOM Terminology