This is a JavaScript React component that represents a task list application. The component defines and manages the state of the application using the useState hook, which includes an array of tasks, the previousFocusEl element, the editedTask, and the isEditing boolean.
The useEffect hook is used to retrieve the list of tasks from a server API and update the state of the application. The component has several child components, including CustomForm, EditForm, and TaskList, which handle adding, editing, and displaying tasks, respectively. The addTask, deleteTask, toggleTask, updateTask, closeEditMode, and enterEditMode functions are defined to handle user interactions and server communication. The component uses Axios to connect to a server API, which is used to retrieve, create, update, and delete tasks from the server.
Overall, the component provides basic CRUD functionality for managing tasks and updating the server API.
This project is being host in a raspberry pi 4. You can acess the website in this link :🕸️
- create a default react app (client folder)
npx create-react-app client- check the database status and info via Prisma (server folder)
npx prisma studio- install all depencies (both folders)
npm install- On the server folder start the backend
npm run start- On the client folder start the frontend
npm run start-> to manage all the services I used: prisma to control the database, pm2 to manage all javascript code and nginx to manage the server.