Skip to content

Instantly share code, notes, and snippets.

View khalid32's full-sized avatar
🤩
enthusiastic

Khalid Syfullah Zaman khalid32

🤩
enthusiastic
15 followers · 7 following
View GitHub Profile
@khalid32
khalid32 / Adding favicon.ico
Created October 24, 2017 07:18
//example
<!DOCTYPE html>
<html lang="en">
<head>
...
<link rel="icon" type="image/png" href="http://glenneggleton.com/files/2016-02/nodejs-logo.png">
...
</head>
<body>
@khalid32
khalid32 / Basic Server using NodeJS
Created October 22, 2017 10:35
a basic server with nodejs(no express).
const http = require('http');
const url = require('url');
const path = require('path');
const fs = require('fs');
const mimeTypes = {
'html': 'text/html',
'jpeg': 'image/jpeg',
'jpg': 'image/jpg',
'png': 'image/png',
@khalid32
khalid32 / Hide Navigation Bar in react-native-router-flux
Last active August 28, 2017 10:28
some tips & tricks on using react-native-router-flux...
// use `hideNavBar={true}` on `Scene`(key=``root``) Component
return (
<Router>
<Scene key="root" hideNavBar={true}>
<Scene key="login" component={Login} title="Login"/>
<Scene key="frontPage" component={FrontPage} title="FrontPage" initial={true}/>
<Scene key="mainPage" component={MainPage}/>
</Scene>
</Router>
@khalid32
khalid32 / React Fiber
Created July 28, 2017 09:52
1. A description of React's new core algorithm, React Fiber
React Fiber is an ongoing reimplementation of React's core algorithm. It is the culmination of over two years of research by the React team.
The goal of React Fiber is to increase its suitability for areas like animation, layout, and gestures. Its headline feature is incremental rendering: the ability to split rendering work into chunks and spread it out over multiple frames.
Other key features include the ability to pause, abort, or reuse work as new updates come in; the ability to assign priority to different types of updates; and new concurrency primitives.
Lear more: https://github.com/acdlite/react-fiber-architecture
2. You can view its Timeline here: http://isfiberreadyyet.com
@khalid32
khalid32 / Animated MapView with Marker.Animated
Created July 18, 2017 05:47
this is an example of how to move MapView.Marker smoothly by using Animated API and Easing...
import React, { Component } from 'react';
import {
StyleSheet,
Text,
View,
Dimensions,
Animated,
Easing,
} from 'react-native';
@khalid32
khalid32 / Animated Objects
Last active July 19, 2017 11:31
import React, { Component } from 'react';
import {
StyleSheet,
Text,
View,
Animated,
Easing,
Image,
} from 'react-native';
@khalid32
khalid32 / Build Tower
Last active July 15, 2017 05:27
function towerBuilder(nFloors) {
let space = "", star = "", result = [];
for (let i = 1; i <= nFloors; i++) {
space = (" ").repeat(nFloors - i);
star = ("*").repeat((2 * i) - 1);
result.push(space + star + space);
}
return result;
}
@khalid32
khalid32 / ListView(Design) using react-native-swipeout
Last active July 11, 2017 05:29
import React, { Component } from 'react';
import {
StyleSheet,
Text,
View,
ListView,
ScrollView
} from 'react-native';
import Swipeout from 'react-native-swipeout';
@khalid32
khalid32 / Slider Component
Created June 25, 2017 17:31
Here I backup all react-native component; basically for understanding how it works...
import React, { Component } from 'react';
import { StyleSheet, Text, View, Slider } from 'react-native';
class SlideText extends React.Component {
constructor(props){
super(props);
this.state = {
value: this.props.value,
min: this.props.min,
@khalid32
khalid32 / Callback Function
Created June 20, 2017 05:12
An example which shows how to write a callback function and a callback-accepting function..
// Create a function that accepts another function as an argument
const callbackAcceptingFunction = (fn) => {
// Calls the function with any required arguments
return fn(1, 2, 3)
}
// Callback gets arguments from the above call
const callback = (arg1, arg2, arg3) => {
return arg1 + arg2 + arg3
}