Sai gowtham saigowthamr

🐢

I may be slow to respond.

JavaScript Developer, Writer, Web Performance

saigowthamr / appprops.txt

Last active April 5, 2018 13:13

	import React, { Component } from "react";
	import logo from "./logo.svg";
	import "./App.css";

	function Counter(props) {
	return (
	<h1>{props.value} 💪</h1>
	);
	}
	class App extends Component {

saigowthamr / app.js

Last active April 5, 2018 12:29

	import React, { Component } from "react";
	import logo from "./logo.svg";
	import "./App.css";
	import NumberContext from "./context";

	function Counter(props) {
	return (
	//by using consumer we are using value in our component.
	// we need to use a function to get our value
	<NumberContext.Consumer>{val => <h1>{val} 💪</h1>}</NumberContext.Consumer>

saigowthamr / gallery grid

Last active April 18, 2018 06:25

saigowthamr / index.html(react)

Last active July 4, 2018 14:16

	<!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>React</title>
	</head>
	<body>
	<div class="connect">

saigowthamr / reactscratchjson

Created May 7, 2018 14:25

	{
	"name": "reactscratch",
	"version": "1.0.0",
	"description": "Create react app from scratch",
	"keywords": [
	"react-app","scratch"
	],
	"main": "index.js",
	"scripts": {
	"watch": "webpack --watch",

saigowthamr / webpack.config.js

Created May 7, 2018 15:11

	const webpack = require('webpack');
	const path = require('path');
	const HtmlWebpackPlugin = require('html-webpack-plugin');
	const MiniCssExtractPlugin = require("mini-css-extract-plugin");
	const UglifyJsPlugin = require('uglifyjs-webpack-plugin')


	module.exports={
	devServer: {
	contentBase: path.join(__dirname, "dist"),

saigowthamr / index.htmlreact

Created May 7, 2018 15:17

	<!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>React from scratch</title>
	</head>
	<body>

saigowthamr / app.js(lazy)

Created May 8, 2018 01:05

	import React, { Component } from "react";

	class App extends Component {
	render() {
	return (
	<div style={{ textAlign: "center", marginTop: "10rem" }}>
	<h1>App is there</h1>
	<p>
	What is Lorem Ipsum?
	Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.

saigowthamr / lazy.js

Created May 8, 2018 01:13

	import Loading from '../components/Loading';
	import Loadable from 'react-loadable';


	export const App=Loadable({
	loader:()=>import('../components/App'),
	loading:Loading
	})

	export const Posts =Loadable({

saigowthamr / router.js(lazy)

Created May 8, 2018 01:22

	import React from "react";
	import { Route } from "react-router-dom";

	import Header from "../header";

	import {App,Posts} from './lazy'


	class ReactRouter extends React.Component {
	render() {