saihaj / saihaj-create-react-app

Template for create-react-app that comes with ESlint and VS Code settings and GitHub actions CI/CD

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Development Setup

This is a create-react-app template that has some add-ons I like to use with my projects. Comes with workflows that you can use to deploy a site on GH-Pages.

Prerequisites

To install dependencies and run it locally:

npm install 

npm start

Now you should have development mode running on http://localhost:3000

ESLint is enabled on this project

Github Actions Workflow

  • continuous-integration:
    • Uses ESLint to do linting tasks
    • It will run on PR's and pushes on all branches.
    • If your commit contains "skip lint" then it will not run the action
  • deploy:
    • To enable this you will need to move it into workflows from disabled-workflows.
    • It will run react build script and deploy the project to gh-pages
    • It runs only on pushes to master branch. (This is setup assuming that you have dev and master branches and master is used as a production branch)
    • NOTE: You will need to modify few things to make sure your deploy works:
      • committer_name: YOUR_GITHUB_NAME
      • commiter_email: YOUR_GITHUB_EMAIL
    • You will need to add a Github Token in Secrets of your repo. Name it deploy_access_token

Available Scripts

In the project directory, you can run:

npm start

Runs the app in the development mode.
Open http://localhost:3000 to view it in the browser.

npm test

No tests currently

npm run build

Builds the app for production to the build folder.
It correctly bundles React in production mode and optimizes the build for the best performance.

The build is minified and the filenames include the hashes.
Your app is ready to be deployed!

npm run lint

This should lint the project and will display and warnings and errors if they exist.

Helpful Resources

You can learn more in the Create React App documentation.

To learn React, check out the React documentation.

This project was bootstrapped with Create React App.

To modify GH-Page deploy action check out and modify accordingly ghaction-github-pages

Credits

Eslint configurations and npm scripts are inspired from @ShabadOS/desktop

About

Template for create-react-app that comes with ESlint and VS Code settings and GitHub actions CI/CD


Languages

Language:HTML 45.7%Language:JavaScript 29.6%Language:CSS 24.7%