This is a React project bootstrapped with
create-react-app
.
There are two repos to run the TaskPro App:
bc48-node-team-project-backend — back end. bc48-node-team-project-frontend — front end.
First ,run the bc48-node-team-project-backend:
npm run start:dev
Then, run the bc48-node-team-project-frontend:
npm run start
Open http://localhost:3000 with your browser to see the result.
You can start editing the page by modifying src/index.js
. The page
auto-updates as you edit the file.
[API routes] can be accessed on ex: http://localhost:3001/api-docs/#/ or whatever port.
The src/secrvices
directory is mapped to /*
.
Backgrounds are stored on Cloudinary cloud storage. Front end fetches backgrounds from back end database, on its turn, back end fetches them from Cloudinary cloud storage.
To upload new background, you need to have all images for all dimensions: mobile(x1/x2), tablet(x1/x2), desktop(x1/x2), and thumbnail. Background file name must correspond to the following format: ex: "26.jpg" — for actual background, ex: "26.png" — for background thumbnail.
There are four different folders for every background size:
background folder, mobile folder, tablet folder, desktop foler, thumbnail folder.
After background upload to Cloudinary cloud storage, connect to MongoDB and clear "backgrounds" collection in order to make back end to fetch all backgrounds from Cloudinary cloud storage.
To connect to MongoDB, use .env-example file at bc48-node-team-project-backend.
For .env data or Cloudinary backrounds upload ask 001elijah.
Finally, enjoy your new backgrounds!
To learn more about React, take a look at the following resources:
- React documentation - learn about React features.
- Learn React - a React tutorial.
- Node.js documentation - learn about Node.js features.
- Learn Express - an Express tutorial.
- Postman website - download Postman.
- MongoDB documentation - learn about MongoDB.