Ecosyste.ms: Awesome

An open API service indexing awesome lists of open source software.

Awesome Lists | Featured Topics | Projects

https://github.com/daraperini/learning-react-typescript-aluroni

This project is a Italian Restaurant's website that used to be just the menu page. It was refectored and now it is a complete website with home, about, details and not found pages.
https://github.com/daraperini/learning-react-typescript-aluroni

classnames css-modules eslint react react-router sass typescript

Last synced: about 2 months ago
JSON representation

This project is a Italian Restaurant's website that used to be just the menu page. It was refectored and now it is a complete website with home, about, details and not found pages.

Awesome Lists containing this project

README 

        
# Aluroni



Aluroni's development started during Alura's Class *React: handling static files*. In this class I created a Italian restaurant menu wich you can navigate as you wish: see the complete menu and order it using the ordanator options, filter specific dishes using the filters or search for a specific dish using the search input.



Then the code was refactored during the course *React: React Router library* so it would be possible to implement React Router. I also created new pages: home, about, details and Not Found. In this class I also standardize the code using ESLint.



For the developmento of the project I used TypeScript. CSS was written using CSS Modules and classNames package.



To see the project development so far, click [here](https://learning-react-typescript-aluroni.vercel.app/).



## Used tools:



* React

* TypeScript

* SASS

* classnames

* React Router

* ESLint



*(Alura is a Brazilian technology school and for acessibility reasons this code is in Portuguese)*



## Initializing the project on your computer



- Clone the repository using the command line:

    - git clone *link of the repository*

    - cd *file of the repository*

 

- Go to the projects main file:

    - cd *name of the file*

 

- Run the code:

    - npm install (to install all project's dependencies)

    - npm start (to open the project on your browser)

 

* In case the project does not opend automatically type http://localhost:3000 on your browser



#



# Aluroni



O Aluroni começou a ser desenvolvido durante o curso *React: lidando com arquivos estáticos*, da Alura. Nesse curso criei a página de cardápio de um restaurante italiano no qual você consegue navegar de acordo com suas preferências: visualize o cardápio inteiro ordenando de acordo com as opções de ordenador, filtre pratos específicos utilizando os filtros ou pesquise por um prato em específico utilizando o input de busca. 



Após, no curso *React: conhecendo a biblioteca React Router*, o código foi refatorado para que fosse possível implementar o React Router. Nesse curso também foram criadas novas páginas: página de início, sobre, detalhes dos pratos e Not Found. Também utilizei o ESLint para padronizar o código.



Para o desenvolvimento do projeto foi utilizado TypeScript. O CSS foi escrito utilizando CSS Modules e o pacote classNames.



Para acessar o desenvolvimento da página até agora, clique [aqui](https://learning-react-typescript-aluroni.vercel.app/).



## Ferramentas utilizadas:



* React

* TypeScript

* SASS

* classnames

* React Router

* ESLint



## Iniciando as versões do projeto na sua máquina



- Clone o repositório através do terminal:

    - git clone *link do repositório*

    - cd *pasta do repositório*

 

- Entre na pasta do projeto:

    - cd *nome da pasta*

 

- Rode o código na sua máquina:

    - npm install (para instalar as dependências do projeto)

    - npm start (para abrir o projeto no seu navegador)

 

* Caso o projeto não abra automaticamente, digite http://localhost:3000 no seu navegador