https://github.com/mullerino/blog
https://github.com/mullerino/blog
axios cssmodules react-router-dom reactjs sass
Last synced: about 2 months ago
JSON representation
- Host: GitHub
- URL: https://github.com/mullerino/blog
- Owner: mullerino
- Created: 2023-03-22T02:07:50.000Z (about 2 years ago)
- Default Branch: main
- Last Pushed: 2023-04-01T16:43:11.000Z (about 2 years ago)
- Last Synced: 2025-02-12T16:22:10.811Z (4 months ago)
- Topics: axios, cssmodules, react-router-dom, reactjs, sass
- Language: TypeScript
- Homepage: https://blog-mullerino.vercel.app
- Size: 214 KB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# Blog News
O projeto em questão tem como objetivo criar uma aplicação front-end que utiliza uma API Restful como fonte de dados. A aplicação deve ter quatro páginas principais: página de posts, usuários, detalhes de cada post e detalhes de cada usuário.
Na página de posts, o usuário poderá visualizar todos os posts publicados pelos usuários da API e, ao clicar em um post específico, será direcionado para a página de detalhes desse post, onde poderá visualizar todos os comentários realizados em relação a ele, além do conteúdo do post.
Na página de usuários, o usuário poderá visualizar todos os usuários cadastrados na API e, ao clicar em um usuário específico, será direcionado para a página de detalhes desse usuário, onde poderá visualizar informações relacionadas a esse usuário.
O projeto tem como finalidade demonstrar a capacidade de desenvolvimento de uma aplicação front-end que interage com uma API Restful, além de mostrar a capacidade de criação de páginas dinâmicas e interativas que apresentem os dados da API de forma clara e organizada.
Antes de iniciar o desenvolvimento do código, realizou-se a construção da interface no Figma, com o intuito de facilitar o desenvolvimento e criar uma interface mais limpa e precisa.
Layout no figma: https://www.figma.com/file/ppeKqIwY181Wdv6y0avP1b/Blog?node-id=0%3A1&t=QDyuizrygK1mTemE-1
## 🚀 Começando
Essas instruções permitirão que você obtenha uma cópia do projeto em operação na sua máquina local para fins de desenvolvimento e teste.
### 📋 Pré-requisitos
Para a aplicação funcionar, é necessário que você tenha todos esses itens em sua máquina
```
Node.js
NPM
Visual studio code
```
### 🔧 Instalação
Após clonar o projeto, acesse a pasta 'Blog' e execute o seguinte comando no seu terminal
```
yarn install
```
Em seguida, para rodar a aplicação, execute o seguinte comando
```
yarn dev
```
Com isso, a aplicação estará funcionando localmente na porta informada no terminal e pronta para ser utilizada.
## 🛠️ Construído com
Ferramentas utilizadas na construção do projeto
* [ReactJs](https://react.dev) - Uma das bibliotecas de JS mais utilizada na atualidade
* [Css Modules](https://github.com/css-modules/css-modules) - Forma eficiente de criar CSS
* [Sass](https://sass-lang.com/documentation/) - Pré-processador de CSS
* [React-Router-DOM](https://reactrouter.com/en/main) - Biblioteca JavaScript de roteamento
* [Axios](https://axios-http.com/ptbr/docs/intro) - Biblioteca JavaScript baseada em Promises
* [Phosphor Icons](https://phosphoricons.com) - Biblioteca de ícones open source
* [Figma](https://www.figma.com) - Plataforma de design colaborativo
## ✒️ Autores
Mencione todos aqueles que ajudaram a levantar o projeto desde o seu início
* **Leandro Müller** - [Github](https://github.com/mullerino)/[Linkdeln](https://www.linkedin.com/in/leandromuller7/)
## 🎁 Expressões de gratidão
* Conte a outras pessoas sobre este projeto 📢;
* Um agradecimento publicamente 🫂;