├── .gitignore ├── .vscode └── settings.json ├── README.md ├── biome.json ├── next.config.ts ├── orval.config.ts ├── package.json ├── pnpm-lock.yaml ├── postcss.config.mjs ├── public └── background.png ├── src ├── app │ ├── (home) │ │ ├── page.tsx │ │ └── subscription-form.tsx │ ├── components │ │ ├── button.tsx │ │ ├── icon-button.tsx │ │ └── input.tsx │ ├── global.css │ ├── invite │ │ └── [subscriberId] │ │ │ ├── invite-link-input.tsx │ │ │ ├── page.tsx │ │ │ ├── ranking.tsx │ │ │ └── stats.tsx │ └── layout.tsx ├── assets │ ├── logo.svg │ ├── medal-cooper.svg │ ├── medal-gold.svg │ └── medal-silver.svg └── http │ └── api.ts └── tsconfig.json /.gitignore: -------------------------------------------------------------------------------- 1 | # See https://help.github.com/articles/ignoring-files/ for more about ignoring files. 2 | 3 | # dependencies 4 | /node_modules 5 | /.pnp 6 | .pnp.* 7 | .yarn/* 8 | !.yarn/patches 9 | !.yarn/plugins 10 | !.yarn/releases 11 | !.yarn/versions 12 | 13 | # testing 14 | /coverage 15 | 16 | # next.js 17 | /.next/ 18 | /out/ 19 | 20 | # production 21 | /build 22 | 23 | # misc 24 | .DS_Store 25 | *.pem 26 | 27 | # debug 28 | npm-debug.log* 29 | yarn-debug.log* 30 | yarn-error.log* 31 | .pnpm-debug.log* 32 | 33 | # env files (can opt-in for committing if needed) 34 | .env* 35 | 36 | # vercel 37 | .vercel 38 | 39 | # typescript 40 | *.tsbuildinfo 41 | next-env.d.ts 42 | -------------------------------------------------------------------------------- /.vscode/settings.json: -------------------------------------------------------------------------------- 1 | { 2 | "[javascript]": { 3 | "editor.defaultFormatter": "biomejs.biome" 4 | }, 5 | "[typescript]": { 6 | "editor.defaultFormatter": "biomejs.biome" 7 | }, 8 | "[typescriptreact]": { 9 | "editor.defaultFormatter": "biomejs.biome" 10 | }, 11 | "editor.codeActionsOnSave": { 12 | "source.organizeImports.biome": "explicit" 13 | }, 14 | "editor.formatOnSave": true 15 | } -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | This is a [Next.js](https://nextjs.org) project bootstrapped with [`create-next-app`](https://nextjs.org/docs/app/api-reference/cli/create-next-app). 2 | 3 | ## Getting Started 4 | 5 | First, run the development server: 6 | 7 | ```bash 8 | npm run dev 9 | # or 10 | yarn dev 11 | # or 12 | pnpm dev 13 | # or 14 | bun dev 15 | ``` 16 | 17 | Open [http://localhost:3000](http://localhost:3000) with your browser to see the result. 18 | 19 | You can start editing the page by modifying `app/page.tsx`. The page auto-updates as you edit the file. 20 | 21 | ## Learn More 22 | 23 | To learn more about Next.js, take a look at the following resources: 24 | 25 | - [Next.js Documentation](https://nextjs.org/docs) - learn about Next.js features and API. 26 | - [Learn Next.js](https://nextjs.org/learn) - an interactive Next.js tutorial. 27 | 28 | You can check out [the Next.js GitHub repository](https://github.com/vercel/next.js) - your feedback and contributions are welcome! 29 | 30 | ## Deploy on Vercel 31 | 32 | The easiest way to deploy your Next.js app is to use the [Vercel Platform](https://vercel.com/new?utm_medium=default-template&filter=next.js&utm_source=create-next-app&utm_campaign=create-next-app-readme) from the creators of Next.js. 33 | 34 | Check out our [Next.js deployment documentation](https://nextjs.org/docs/app/building-your-application/deploying) for more details. 35 | -------------------------------------------------------------------------------- /biome.json: -------------------------------------------------------------------------------- 1 | { 2 | "$schema": "./node_modules/@biomejs/biome/configuration_schema.json", 3 | "organizeImports": { 4 | "enabled": true 5 | }, 6 | "formatter": { 7 | "indentStyle": "space", 8 | "indentWidth": 2, 9 | "lineWidth": 80 10 | }, 11 | "javascript": { 12 | "formatter": { 13 | "arrowParentheses": "asNeeded", 14 | "jsxQuoteStyle": "double", 15 | "quoteStyle": "single", 16 | "semicolons": "asNeeded", 17 | "trailingCommas": "es5" 18 | } 19 | }, 20 | "linter": { 21 | "enabled": true, 22 | "rules": { 23 | "recommended": true, 24 | "a11y": { 25 | "noSvgWithoutTitle": "off" 26 | }, 27 | "suspicious": { 28 | "noArrayIndexKey": "info" 29 | } 30 | } 31 | }, 32 | "files": { 33 | "ignore": [ 34 | "node_modules" 35 | ] 36 | } 37 | } -------------------------------------------------------------------------------- /next.config.ts: -------------------------------------------------------------------------------- 1 | import type { NextConfig } from "next"; 2 | 3 | const nextConfig: NextConfig = { 4 | /* config options here */ 5 | }; 6 | 7 | export default nextConfig; 8 | -------------------------------------------------------------------------------- /orval.config.ts: -------------------------------------------------------------------------------- 1 | import { defineConfig } from 'orval' 2 | 3 | export default defineConfig({ 4 | api: { 5 | input: 'http://localhost:3333/docs/json', 6 | output: { 7 | target: './src/http/api.ts', 8 | client: 'fetch', 9 | httpClient: 'fetch', 10 | clean: true, 11 | baseUrl: 'http://localhost:3333', 12 | 13 | override: { 14 | fetch: { 15 | includeHttpResponseReturnType: false, 16 | }, 17 | }, 18 | }, 19 | }, 20 | }) 21 | -------------------------------------------------------------------------------- /package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "nlw-connect-react", 3 | "version": "0.1.0", 4 | "private": true, 5 | "scripts": { 6 | "dev": "next dev --turbopack", 7 | "build": "next build", 8 | "start": "next start", 9 | "lint": "next lint" 10 | }, 11 | "dependencies": { 12 | "@hookform/resolvers": "^3.10.0", 13 | "@tailwindcss/postcss": "^4.0.4", 14 | "lucide-react": "^0.474.0", 15 | "next": "15.1.6", 16 | "orval": "^7.5.0", 17 | "postcss": "^8.5.1", 18 | "react": "^19.0.0", 19 | "react-dom": "^19.0.0", 20 | "react-hook-form": "^7.54.2", 21 | "tailwind-merge": "^3.0.1", 22 | "tailwindcss": "^4.0.4", 23 | "zod": "^3.24.1" 24 | }, 25 | "devDependencies": { 26 | "@biomejs/biome": "^1.9.4", 27 | "@types/node": "^20", 28 | "@types/react": "^19", 29 | "@types/react-dom": "^19", 30 | "typescript": "^5" 31 | } 32 | } 33 | -------------------------------------------------------------------------------- /postcss.config.mjs: -------------------------------------------------------------------------------- 1 | const config = { 2 | plugins: { 3 | "@tailwindcss/postcss": {}, 4 | }, 5 | }; 6 | export default config; -------------------------------------------------------------------------------- /public/background.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/rocketseat-education/nlw-connect-react/1102be9ee77159966e9542129af40e1db9f5bba7/public/background.png -------------------------------------------------------------------------------- /src/app/(home)/page.tsx: -------------------------------------------------------------------------------- 1 | import { Radio } from 'lucide-react' 2 | import Image from 'next/image' 3 | import logo from '../../assets/logo.svg' 4 | import { SubscriptionForm } from './subscription-form' 5 | 6 | export default function Home() { 7 | return ( 8 |
9 |
10 | devstage 11 | 12 |

13 | CodeCraft Summit 2025 14 |

15 |
16 | 17 |
18 |
19 |
20 |

21 | Sobre o evento 22 |

23 | 24 | 25 | AO VIVO 26 | 27 |
28 |

29 | Um evento feito por e para pessoas desenvolvedoras apaixonadas por 30 | criar soluções inovadoras e compartilhar conhecimento. Vamos 31 | mergulhar nas tendências mais recentes em desenvolvimento de 32 | software, arquitetura de sistemas e tecnologias emergentes, com 33 | palestras, workshops e hackathons. 34 |
35 |
36 | Dias 15 a 17 de março | Das 18h às 21h | Online & Gratuito 37 |

38 |
39 | 40 | 41 |
42 |
43 | ) 44 | } 45 | -------------------------------------------------------------------------------- /src/app/(home)/subscription-form.tsx: -------------------------------------------------------------------------------- 1 | 'use client' 2 | 3 | import { subscribeToEvent } from '@/http/api' 4 | import { zodResolver } from '@hookform/resolvers/zod' 5 | import { ArrowRight, Mail, User } from 'lucide-react' 6 | import { useRouter, useSearchParams } from 'next/navigation' 7 | import { useForm } from 'react-hook-form' 8 | import { z } from 'zod' 9 | import { Button } from '../components/button' 10 | import { InputField, InputIcon, InputRoot } from '../components/input' 11 | 12 | const subscriptionSchema = z.object({ 13 | name: z.string().min(2, 'Digite seu nome completo'), 14 | email: z.string().email('Digite um e-mail válido'), 15 | }) 16 | 17 | type SubscriptionSchema = z.infer 18 | 19 | export function SubscriptionForm() { 20 | const router = useRouter() 21 | const searchParams = useSearchParams() 22 | 23 | const { 24 | register, 25 | handleSubmit, 26 | formState: { errors }, 27 | } = useForm({ 28 | resolver: zodResolver(subscriptionSchema), 29 | }) 30 | 31 | async function onSubscribe({ name, email }: SubscriptionSchema) { 32 | const referrer = searchParams.get('referrer') 33 | const { subscriberId } = await subscribeToEvent({ name, email, referrer }) 34 | 35 | router.push(`/invite/${subscriberId}`) 36 | } 37 | 38 | return ( 39 |
43 |

44 | Inscrição 45 |

46 | 47 |
48 |
49 | 50 | 51 | 52 | 53 | 58 | 59 | 60 | {errors?.name && ( 61 |

62 | {errors.name.message} 63 |

64 | )} 65 |
66 | 67 |
68 | 69 | 70 | 71 | 72 | 77 | 78 | 79 | {errors?.email && ( 80 |

81 | {errors.email.message} 82 |

83 | )} 84 |
85 |
86 | 87 | 91 |
92 | ) 93 | } 94 | -------------------------------------------------------------------------------- /src/app/components/button.tsx: -------------------------------------------------------------------------------- 1 | import type { ComponentProps } from 'react' 2 | 3 | interface ButtonProps extends ComponentProps<'button'> {} 4 | 5 | export function Button(props: ButtonProps) { 6 | return ( 7 |