Deploy React apps to Netlify in a neater reapportion.

My Workflow

Have everything run and built from the get-go on github by github actions whenever you push a commit and enjoy a smooth deployment on Netlify.

With the previous in mind follow these steps:

• Create your react project as usual npx create-react-app app_name.
• Build using npm run build
• Then go ahead and set your workflow, to generate a .yml file.

• Create a netlify.toml file and then add the following code:

  • [build]
  • command = "npm run build"
  • publish = "build"

• Drag and drop your build folder into your netlify site.

• Generate a personal access token on netlify by going in user settings, applications and copy it to github secret.

• Copy Api ID from netlify site to github secrets.

• Create yaml file & add the tokens from secrets.
• Add netlify deploy -–prod to yaml file

Submission Category:

DIY Deployments.

Yaml File or Link to Code

Add the .yml file as follows .github/workflows/name.yml in the project. For more reference see the official docs

name: CI/CD on: push: branches: [ your_branch_name ] pull_request: branches: [ your_branch_name ] jobs: build: runs-on: ubuntu-latest strategy: matrix: node-version: [12.x, 14.x] steps: - name: Checkout repository uses: actions/checkout@v2 - name: Set up Node.js ${{ matrix.node-version }} uses: actions/setup-node@v1 with: node-version: ${{ matrix.node-version }} - name: Install dependencies run: npm install - name: Run the tests run: npm test - name: Build run: npm run build - name: Deploy Site env: NETLIFY_SITE_ID: ${{ secrets.GITHUB_TOKEN_NAME }} NETLIFY_AUTH_TOKEN: ${{ secrets.GITHUB_TOKEN_NAME }} run: netlify deploy --prod 

Additional Resources / Info

Github repository

Under MIT License

Happy coding ^ ^