Uma simples loja virtual de livros usando Node.JS, Next.Js, Typescript e outros.
Bookstore nada mais é do que uma simples loja virtual de livros onde tem como principais funcionalidades um fluxo de escolha de produto, carrinho e checkout para pagamento, o principal objetivo de realizar este projeto foi para aprender e entender como funcionam certas tecnologias como Next.JS, conceitos de SSR (Server Side Rendering), fluxo de checkout entre outros. Essas são as principais telas:
- Listagem de produtos
- CRUD de produtos no carrinho de compras
- Checkout 1 - Formulário de informações de envio
- Checkout 2 - Escolha de método de pagamento
OBS: Vou levar em consideração de que você já possui o Git, NodeJS e o Yarn instalados.
Antes de começarmos é importante ressaltar que este repositório utiliza uma estrutura de monorepo, caso não saiba oque isso significa recomendo que leia este artigo sobre Como funciona um monorepo em JavaScript. Dito isso vamos começar!
Um dos requisitos do projeto é ter instalado PostgresSQL na sua máquina, caso não tenha basta entrar no site do postgres e fazer o download, a instalação é super tranquila.
OBS: No processo de instalação/configuração do postgres você irá escolher um nome de usuário e senha do seu banco de dados, guarde essas informações pois usaremos elas mais tarde.
O próximo passo é clonar o repositório para a sua máquina, para isso abra seu terminal na pasta em que deseja fazer o donwload e digite:
git clone https://github.com/wesleyoliveira820/bookstore.git
Neste momento você pode abrir a pasta do projeto no seu editor/IDE favorito.
Agora com o seu terminal aberto na raiz do projeto digite:
yarn
Este comando irá instalar todas as dependências que o projeto necessita para rodar.
Agora em packages/server renomeie o arquivo .env.example para .env abra o arquivo e nele você verá algumas informações, estas são as variáveis de ambiente que o projeto utiliza para rodar, lembra daquele nome de usuário e senha do postgres? Então, essas informações serão colocadas aqui em seus respectivos campos, modifique estes campos conforme necessitar.
Seguindo no tutorial volte para o terminal ainda na pasta raiz do projeto, iremos inicializar o servidor do backend e para isso digite:
yarn workspaces @bookstore/server dev:server
Para inicializar o frontend o comando é bem semelhante, alterando o nome do pacote:
yarn workspaces @bookstore/client dev
Agora basta abrir https://localhost:3000 no navegador e vualá!