bernard-silva / backend-todo-mine

My Todo-app with Node.js and frontend with Vanilla JavaScript

Todo App

Português / English

📝 Índice

• Sobre
• Linguagens e Ferramentas
• Aprendizados
• Como executar localmente?

🎯 Sobre

• Clone de Lista de Tarefas do design Todo app UI design do dribbble e aplicado Javascript Funcional no frontend para criação dos elementos (createElement). Observação: botão de data/hora apenas ilustrativo, não está funcional.

• Desenvolvido API backend com Node.js/Express e base de dados com o ORM Prisma.

• Utilizado a recurso Static Public do Express para desenvolvimento do frontend e body-parser como middleware nas chamadas à API.

⚒ Linguagens e Ferramentas

• HTML
• CSS
• JavaScript
• Node.js
• Express
• Prisma
• SQLite
• Font Awesome Icon

💡 Aprendizados

• Desenvolvimento de uma API
• Modelagem de base dados com ORM Prisma
• Static Public do Express para desenvolvimento do frontend em conjunto com o backend (app.use(express.static('public')))
• Biblioteca body-parser que serve como um middleware do backend para analisar as informações do body enviadas do frontend para backend.
• Diversas linhas de comandos utilizadas no decorrer do desenvolvimento, confira documentação aqui

🖥️ Como executar localmente?

Clone o projeto:

git clone https://github.com/bernard-silva/backend-todo-mine.git

Instala conforme o que estiver declarado no package.json:

npm install

Obervação: criar um arquivo .env na raiz para uso do SQLite como dev:

DATABASE_URL="file:./dev.db"

Cria o schema para base de dados conforme arquivo .env:

npx prisma migrate dev

Roda o projeto:

npm run dev

English

📝 Index

• About
• Languages and Tools
• Learnings
• How to run locally?

🎯 About

• Clone of Todo app UI design from dribbble and applied Functional Javascript to the frontend to create the elements (createElement). Note: date/time button for illustration purposes only, not functional.

• Developed backend API with Node.js/Express and database with ORM Prisma.

• Used the Static Public feature of Express to develop the frontend and body-parser as middleware in API calls.

⚒ Languages and Tools

• HTML
• CSS
• JavaScript
• Node.js
• Express
• Prisma
• SQLite
• Font Awesome Icon

💡 Learnings

• Development of an API
• Database modeling with ORM Prisma
• Express Static Public for frontend development in conjunction with the backend (app.use(express.static('public')))
• Body-parser library that serves as a backend middleware to parse body information sent from the frontend to the backend.
• Several command lines used during development, check documentation here

🖥️ How to run locally?

Clone the project:

git clone https://github.com/bernard-silva/backend-todo-mine.git

Installs according to what is declared in package.json:

npm install

Note: create a .env file in the root for SQLite use as dev:

DATABASE_URL="file:./dev.db"

Create the schema for the database according to the .env file:

npx prisma migrate dev

Run the project:

npm run dev