Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/devgabrielrr/igniteshop-next-rocketseat
Combinamos estilo e tecnologia para oferecer uma experiência de compra excepcional. construída com React e Next.js, Para garantir uma experiência de pagamento segura e sem complicações, integramos nossa loja com a API do Stripe.
https://github.com/devgabrielrr/igniteshop-next-rocketseat
api nextjs react stripe styled-components
Last synced: 17 days ago
JSON representation
Combinamos estilo e tecnologia para oferecer uma experiência de compra excepcional. construída com React e Next.js, Para garantir uma experiência de pagamento segura e sem complicações, integramos nossa loja com a API do Stripe.
- Host: GitHub
- URL: https://github.com/devgabrielrr/igniteshop-next-rocketseat
- Owner: DevGabrielrr
- Created: 2024-08-15T12:41:51.000Z (3 months ago)
- Default Branch: main
- Last Pushed: 2024-08-23T17:40:57.000Z (3 months ago)
- Last Synced: 2024-10-10T17:22:13.125Z (about 1 month ago)
- Topics: api, nextjs, react, stripe, styled-components
- Language: TypeScript
- Homepage:
- Size: 32.2 KB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# Projeto Ignite Shop | Rocketseat
Ignite Shop, sua nova loja online especializada em camisetas exclusivas da Rocketseat! Combinamos estilo e tecnologia para oferecer uma experiência de compra excepcional.
construída com React e Next.js, Para garantir uma experiência de pagamento segura e sem complicações, integramos nossa loja com a API do Stripe.
https://github.com/user-attachments/assets/58cb47c2-c185-4ab0-9e25-1eb948b08a73
### Tecnologias Utilizadas
- React: ^18.3.1
- Typescript: ^5.2.2
- Next ^14.2.3
- Stripe
### Funcionalidades
- [x] Navegue pela nossa seleção de camisetas, escolha a que mais combina com você e visualize detalhes como preço e descrição com apenas alguns cliques.
- [x] Cada camiseta é apresentada com imagens de alta qualidade e informações detalhadas para que você possa tomar a melhor decisão de compra.
- [x] Integração com Stripe para um Pagamento Seguro
### Aprendizado
- axios;
- Styled-components;
- Radix UI;
- api stripe
### 📦 Bibliotecas
⬇️ Permite que você escreva CSS dentro dos seus componentes React usando uma sintaxe de template literals. Em vez de criar arquivos CSS separados ou usar classes CSS tradicionais.
```
npm i styled-components
npm i @types/styled-components -D
```
⬇️Biblioteca que permite uma integração do seu projeto React para qualquer serviço de API disponível.
```
npm i axios
```
⬇️Biblioteca keen-slider para layout de slides no site
```
npm install keen-slider
```
⬇️Biblioteca para facilitar a integração de funcionalidades de pagamento em sua aplicação. Com essa biblioteca, você pode realizar diversas operações.
```
npm i stripe
```
⬇️ Uma ferramenta de styling para aplicações React que permite criar componentes estilizados com uma API intuitiva e de alto desempenho.
```
npm install @stitches/react
```
### Como Executar o Projeto
1. Clone o repositório:
```bash
https://github.com/DevGabrielrr/IgniteShop-Next-rocketseat.git
```
2. Navegue até o diretório do projeto:
```bash
cd nome-do-repositorio
```
3. Atualize o projeto, Em seu terminal e na pasta do projeto
```bash
npm install
```
4. Rodar o projeto
```bash
npm run dev
```