Skip to content

khoivudev/tutorial-web-frontend-react-redux-todolist

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

6 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

INTRO

This is todo-list front-end app.
This app call an RESTful API.
Current can GET- ADD- DELETE todotask

  • Tech:
    • ReactJs:
      • Class Component programming
    • Redux :
      • component -> actions -> reducer -> store
    • UI component: material-ui
    • build packet: npm
    • follow MERN stack programing

DEVELOPMENT

  1. Set proxy, must to be a string in package.json file

  2. For example

{  
    "proxy": "https://backend.example.com"
}
  1. Run project npm install && npm start || yarn install && yarn start

DEPLOYMENT

Set Proxy to deloy Heroku:

  1. When deploy on heroku, just push only package-lock.json or yarn.lock. Dont push both those files! npm install || yarn install

  2. Create static.json file

{
    "root": "build/",
    "clean_urls": false,
    "routes": {
        "/**": "index.html"
    },
    "https_only": true,
    "headers": {
        "/**": {
            "Strict-Transport-Security": "max-age=7776000"
        }
    },
    "proxies": {
        "/api/": {
            "origin": "${API_URL}"
        }
    }
}
  1. Push file to heroku git push heroku master

  2. Config proxy heroku All request from react contain "/api/abc" -> "/abc"
    For example:
    From react: axios.get("/api/search-items") → ${API_URL}/search-items
    From react: axios.get("/api/users/me") → ${API_URL}/users/me
    (!)Therefore, run this cmd to set proxy var in heroku:

heroku config:set API_URL="https://backend.example.com/api"

About

No description or website provided.

Topics

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published