https://github.com/pa4080/react-simple-task-manager
Simple JavaScript React (To-do) application, exercise of REST API.
https://github.com/pa4080/react-simple-task-manager
express expressjs favascript reactjs rest-api
Last synced: 2 months ago
JSON representation
Simple JavaScript React (To-do) application, exercise of REST API.
- Host: GitHub
- URL: https://github.com/pa4080/react-simple-task-manager
- Owner: pa4080
- License: gpl-3.0
- Created: 2022-05-07T05:37:20.000Z (about 4 years ago)
- Default Branch: master
- Last Pushed: 2022-06-19T10:59:21.000Z (about 4 years ago)
- Last Synced: 2025-06-19T08:08:55.296Z (about 1 year ago)
- Topics: express, expressjs, favascript, reactjs, rest-api
- Language: JavaScript
- Homepage: https://stasks.metalevel.tech/github
- Size: 114 KB
- Stars: 0
- Watchers: 2
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# Simple Task Manager
Simple JavaScript/React application - a homework project, and currently it is:
* Exercise of REST API Requests
* Node.js and Express
* React.js
## Development deploy and run
Start the backend server. It is implementation of Express that provides Json-server. The Express server will run at `http://localhost:48004` and will provide the Json-server at `http://localhost:48004/api[/tasks]`.
```bash
cd server
npm install
npm run db-create
npm run supervisor
```
Push the running server as background process or open new terminal and start the React's dev server.
```bash
cd app
npm install
npm start
```
The React's dev web server, by default, will run at `http://localhost:3000`. It will proxy all requests for non static resources to the Express server's port - check the `"proxy"` directive in [package.json](./app/package.json). So we can access the Json-server at `http://localhost:3000/api[/tasks]`.
## Production build and run
In this case we need to build the React application. Then it will be served via the Express server. And everything will be accessible at `http://localhost:48004`.
```bash
cd app && npm i && npm run build
cd -
cd server && npm i && npm run db-create && npm start
```
*Read [CLI.md](./CLI.md) For more information.*
## Json-server
The application [json-server](https://github.com/typicode/json-server) is used as backend database server. It is provided via Express.
### Json-server references
* Video Tutorial: [Creating demo APIs with json-server](https://egghead.io/lessons/javascript-creating-demo-apis-with-json-server)
* Official docs: [json-server](https://github.com/typicode/json-server)
* [Postman](https://www.postman.com/downloads/) - an API platform for building and using APIs. Postman simplifies each step of the API lifecycle and streamlines collaboration so you can create better APIs—faster.
* [`npm install package-name --save-dev` not updating `package.json`](https://stackoverflow.com/a/62706498/6543935)
* [integrate json-server with express server](https://github.com/typicode/json-server/issues/253)
### Json-server basic requests
|Method |Path |Action |
| --- | --- | --- |
|GET |/tasks |get all tasks |
|GET |/tasks/id |get Todo by id |
|POST |/tasks |add new Todo |
|PUT |/tasks/id |update Todo by id |
|DELETE |/tasks/id |remove Todo by id |
### Q&A
**Q:** [Which is better](https://github.com/metalevel-tech/js-simple-task-manager/commit/55215199ae24c3d5d5526438469c0c6ebefe51ed#diff-6ea1aaf1b9c53ddae6d7edf1fa3ff1e34adb5a392fd2fa79e17d92b292e49c18)?
**A:** The first variant is better in this case. At all we do not need Context for this simle task and the variant from the branch [ReactJsHooksSyntaxBeforeContext](https://github.com/metalevel-tech/js-simple-task-manager/tree/ReactJsHooksSyntaxBeforeContext) is just fine. But this is just an exercise so the Context example will be leaved here with the first variant according to the question.