Light

knaxus / react-simple-starter Goto Github PK

View Code? Open in Web Editor NEW

50.0 15.0 26.0 1.89 MB

:zap: Webpack custom create-react-app with HMR

Home Page: https://ashokdey.in

JavaScript 85.82% HTML 1.44% CSS 12.74%

react-boilerplate-2020 react-starterkit react-starter react-redux react-saga beginner-project beginner-code beginners-guide beginners

react-simple-starter's Introduction

React Simple Starter

🎒 Get up and running with 🔥 [hot reload] and optimized production build 💎

Result of revisiting to webpack basics 😊

Quick start

Clone this repo
Run npm run quick/yarn quick
Go to http://localhost:5050

Features

🔥 Hot Reload
Creates files using commands
- Containers with test files : yarn cont MyContainer1 MyContainer2
- Component with test file: yarn comp MyComponent1 MyConponent2
Linting using ESLint following Airbnb style guide
Testing using Jest

Commands

clean-init: To start with a fresh repo
comp: Create component folder and files (including test file)
cont: Create container folder and files (including test file)
start: Start the dev server running at http://localhost:5050
build: Build for production, ready to host
test: Run tests in watch mode
quick: Clean and install dependencies, start the server

Example app

More docs will be updated soon

If you use it somewhere, you have to link back to Knaxus(https://ashokdey.in/opensource)

This work is licensed under a Creative Commons Attribution 3.0 Unported License.

react-simple-starter's People

Contributors

Stargazers

Watchers

react-simple-starter's Issues

Update to Webpack 4

Hello folks, I made this template for my talk on "Webpack - Inside out". Now things have changed a lot and what I want you guys to do is to keep a copy of this boilerplate with Webpack 4

What you have to do?

Keep a branch with the name - webpack-4
No change to the repo structure/file structure
Update the required packages to the latest version
Only create a PR if you made sure the boilerplate is working fine

All the best 🎊 🔥

Add example app [React.js] for Parcel build

Hey folks, you will notice that this repo contains 3 branches:

master
parcel
webpack-4

What is required?

Remove the old app
Add new sample app (must contain an API call)
Use the latest version of react and react hooks
Update the README for the branch

Notes:

Your PR should point to the parcel branch
Your PR should contain screenshots of the working app you added
Add a star if you like the work and this will motivate the project owners to do more

Update the boilerplate

You can update it to the latest version of React.js

Upgrade to webpack4 and add prettier support.

I would like to contribute to upgrade this to webpack 4 and add prettier pre commit hooks.

Add a flavour of Parcel

Hello folks, I made this template for my talk on "Webpack - Inside out". Now things have changed a lot and what I want you guys to do is to keep a copy of this boilerplate with Parcel

What you have to do?

Keep a branch with the name - parcel
No change to the repo structure/file structure
Update the required packages to the latest version
Only create a PR if you made sure the boilerplate is working fine

All the best 🎊 🔥

Update the boilerplate [React.js Beginners]

Hello folks, it's been a long time I prepared this for my talk on Webpack. React has gone through big changes so far. What you can do here:

Update all the packages
Update to Babel 7
Update to the latest version of React.js

Fix the broken example app [React.js Beginners]

Hello folks, it's been a long time I prepared this for my talk on Webpack. React has gone through big changes so far. What you can do here is:

Fix the broken app that is made using this boilerplate and currently is not working

Fix Example App

Hi
I would like to contribute to this repository!

Add an example app using React Hooks [React.js Beginners]

Hello folks, it's been a long time I prepared this for my talk on Webpack. React has gone through big changes so far. What you can do here is to add an example app using this boilerplate and using React Hooks

Recommend Projects

React

A declarative, efficient, and flexible JavaScript library for building user interfaces.
Vue.js

🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
Typescript

TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
TensorFlow

An Open Source Machine Learning Framework for Everyone
Django

The Web framework for perfectionists with deadlines.
Laravel

A PHP framework for web artisans
D3

Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

javascript

JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
web

Some thing interesting about web. New door for the world.
server

A server is a program made to process requests and deliver data to clients.
Machine learning

Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Visualization

Some thing interesting about visualization, use data art
Game

Some thing interesting about game, make everyone happy.

Recommend Org

Facebook

We are working to build community through open source technology. NB: members must have two-factor auth.
Microsoft

Open source projects and samples from Microsoft.
Google

Google ❤️ Open Source for everyone.
Alibaba

Alibaba Open Source for everyone
D3

Data-Driven Documents codes.
Tencent

China tencent open source team.