Skip to content

Instantly share code, notes, and snippets.

View gladchinda's full-sized avatar

Glad Chinda gladchinda

94 followers · 30 following
View GitHub Profile
@gladchinda
gladchinda / realtime-chat-Chat-3.jsx
Created April 25, 2018 13:11
{/** CHAT HEADER HERE **/}
<div className="px-4 pb-4 w-100 d-flex flex-row flex-wrap align-items-start align-content-start position-relative" style={{ height: 'calc(100% - 180px)', overflowY: 'scroll' }}>
{this.state.chats.map((chat, index) => {
const previous = Math.max(0, index - 1);
const previousChat = this.state.chats[previous];
const position = chat.user === this.props.activeUser ? "right" : "left";
@gladchinda
gladchinda / js-truthy-falsy.js
Created April 30, 2018 14:26
// FALSY VALUES
console.log(!!0); // false
console.log(!!-0); // false
console.log(!!''); // false
console.log(!!false); // false
console.log(!!NaN); // false
console.log(!!null); // false
console.log(!!undefined); // false
@gladchinda
gladchinda / js-short-circuiting-and.js
Last active April 30, 2018 16:38
// METHOD 1: Using if statement
if (person) {
fetchProfile(person);
}
// METHOD 2: Using short-circuiting
person && fetchProfile(person);
@gladchinda
gladchinda / js-short-circuiting-or.js
Created April 30, 2018 16:36
// METHOD 1: Using if/else statements
let requestAnimFrame = null;
if (window.requestAnimationFrame) {
requestAnimFrame = window.requestAnimationFrame;
}
else if (window.webkitRequestAnimationFrame) {
requestAnimFrame = window.webkitRequestAnimationFrame;
}
@gladchinda
gladchinda / js-short-circuiting-booleans.js
Created April 30, 2018 17:43
// Function that accepts a boolean as first argument
// and returns the boolean otherwise `false`
const booleanOrFalse = value => (typeof value == 'boolean') && value;
// Function that accepts a boolean as first argument
// and returns the boolean otherwise `true`
const booleanOrTrue = value => (typeof value != 'boolean') || value;
console.log(booleanOrFalse(true)); // true
console.log(booleanOrFalse(false)); // false
@gladchinda
gladchinda / bootstrap-link.html
Last active May 13, 2018 18:23
@gladchinda
gladchinda / bootstrap-scripts.html
Last active May 13, 2018 18:23
<script src="https://code.jquery.com/jquery-3.3.1.slim.min.js"
integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo"
crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.0/umd/popper.min.js"
integrity="sha384-cs/chFZiN24E4KMATLdqdvsezGxaGsi4hLGOzlXwp5UZB1LY//20VyM2taTB4QvJ"
crossorigin="anonymous"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.1.0/js/bootstrap.min.js"
integrity="sha384-uefMccjFJAIv6A+rW+L4AHf99KvxDjWSu1z9VI8SKNVmz4sk7buKt/6v9KI65qnm"
@gladchinda
gladchinda / rwb::public|index.html
Last active May 13, 2018 18:25
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<meta name="theme-color" content="#000000">
<!--
manifest.json provides metadata used when your web app is added to the
homescreen on Android. See https://developers.google.com/web/fundamentals/engage-and-retain/web-app-manifest/
-->
@gladchinda
gladchinda / rwb::src|index|1.js
Last active May 13, 2018 18:28
import 'bootstrap/dist/css/bootstrap.min.css';
import React from 'react';
import ReactDOM from 'react-dom';
import './index.css';
import App from './App';
import registerServiceWorker from './registerServiceWorker';
ReactDOM.render(<App />, document.getElementById('root'));
registerServiceWorker();
@gladchinda
gladchinda / rwb::src|index|2.js
Created May 13, 2018 18:29
import 'bootstrap/dist/css/bootstrap.min.css';
import $ from 'jquery';
import Popper from 'popper.js';
import 'bootstrap/dist/js/bootstrap.bundle.min';
import React from 'react';
import ReactDOM from 'react-dom';
import './index.css';
import App from './App';
import registerServiceWorker from './registerServiceWorker';