{"id":18897794,"url":"https://github.com/vitorserrano/reactsetup","last_synced_at":"2026-04-11T17:41:14.681Z","repository":{"id":101701787,"uuid":"326048460","full_name":"vitorserrano/reactsetup","owner":"vitorserrano","description":"📚 Estrutura ReactJS + Next.js, TypeScript, ESLint, Prettier, Editorconfig e Styled Components","archived":false,"fork":false,"pushed_at":"2021-01-02T20:51:45.000Z","size":119,"stargazers_count":0,"open_issues_count":0,"forks_count":0,"subscribers_count":1,"default_branch":"master","last_synced_at":"2025-11-01T07:03:02.602Z","etag":null,"topics":["editorconfig","eslint","nextjs","prettier","reactjs","styled-components","typescript"],"latest_commit_sha":null,"homepage":"","language":"TypeScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/vitorserrano.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2021-01-01T20:10:51.000Z","updated_at":"2021-01-02T20:51:47.000Z","dependencies_parsed_at":null,"dependency_job_id":"e71ed21a-fbd9-4ef6-a695-1267ce860d91","html_url":"https://github.com/vitorserrano/reactsetup","commit_stats":null,"previous_names":[],"tags_count":0,"template":true,"template_full_name":null,"purl":"pkg:github/vitorserrano/reactsetup","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/vitorserrano%2Freactsetup","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/vitorserrano%2Freactsetup/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/vitorserrano%2Freactsetup/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/vitorserrano%2Freactsetup/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/vitorserrano","download_url":"https://codeload.github.com/vitorserrano/reactsetup/tar.gz/refs/heads/master","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/vitorserrano%2Freactsetup/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":286080680,"owners_count":31689762,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2026-04-11T13:07:20.380Z","status":"ssl_error","status_checked_at":"2026-04-11T13:06:47.903Z","response_time":54,"last_error":"SSL_connect returned=1 errno=0 peeraddr=140.82.121.5:443 state=error: unexpected eof while reading","robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":false,"can_crawl_api":true,"host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["editorconfig","eslint","nextjs","prettier","reactjs","styled-components","typescript"],"created_at":"2024-11-08T08:39:33.735Z","updated_at":"2026-04-11T17:41:14.667Z","avatar_url":"https://github.com/vitorserrano.png","language":"TypeScript","readme":"\u003cp align=\"center\"\u003e\n  \u003cimg src=\"https://user-images.githubusercontent.com/51726945/103447385-726daf00-4c69-11eb-859e-2a66c6d8d98c.png\" width=\"350px\" /\u003e\n\u003c/p\u003e\n\n\u003ch3 align=\"center\"\u003e\n  ReactJS + NextJS setup\n\u003c/h3\u003e\n\n## :bookmark: Sobre\n\nEste repositório é um template para projetos ReactJS com NextJS com typescript criado a partir de um [vídeo](https://www.youtube.com/watch?v=1nVUfZg2dSA\u0026t=244s) da [Rocketseat](rocketseat.com.br).\n\n## :rocket: Tecnologias utilizadas\n\n- Reactjs\n- Nextjs\n- Typescript\n- Eslint\n- Prettier\n- Editorconfig\n- Styled Components\n\n## :fire: Pré-requisitos\n\n- Node.js\n- NPM ou Yarn\n\n## :zap: Como usar\n\n1. Faça um clone desse repositório: `https://github.com/vitorserrano/reactsetup.git`\n2. Instale as dependências: `npm install` ou `yarn`\n3. Inicie a aplicação: `npm run dev` ou `yarn dev`\n\n## :books: Documentação\n\n1. Criação do projeto Reactjs + Nextjs: `yarn create next-app myApp`\n\n2. Adicionar typescript:\n   - Adicionar dependência: `yarn add typescript @types/react @types/node -D`\n   - Alterar as extensões `.js` dentro de `/pages` para `.tsx`\n   - Rodar o comando: `yarn dev` para aplicar o typescript\n\n3. Adicionar Eslint + Prettier:\n- Adicionar dependência **Eslint**: `yarn add eslint -D`\n- Iniciar arquivo: `yarn eslint --init`\n- Remover arquivo `package.json.lock` e rodar `yarn`\n- Adicionar dependência **Prettier**: `yarn add prettier eslint-plugin-prettier eslint-config-prettier -D`\n- Adicionar dependência Typescript ao Eslint: `yarn add @typescript-eslint/eslint-plugin @typescript-eslint/parser`\n- Dentro de `eslintrc.json`:\n  - Em `\"extends\"`adicionar:\n    ```json\n        \"eslint:recommended\",\n        \"plugin:react/recommended\",\n        \"plugin:prettier/recommended\",\n        \"plugin:@typescript-eslint/recommended\",\n        \"prettier/@typescript-eslint\",\n        \"prettier\",\n        \"prettier/react\"\n    ```\n  - Em `\"plugins\"` adicionar: `\"prettier\"`\n  - Em `\"rules\"` adicionar: `\"prettier/prettier\": \"error\"`\n- Criar `.eslintignore` e adicionar:\n  ```json\n  node_modules\n\t.next\n\t/*.js\n  ```\n - Criar `prettier.config.js` e adicionar:\n  ```javascript\n      module.exports = {\n        semi: true,\n        singleQuote: true,\n        arrowParens: \"avoid\",\n        trailingComma: \"all\",\n        endOfLine: \"auto\",\n      };\n  ```\n4. Adicionar **Styled Components**\n  - Instalar dependência: `yarn add styled-components`\n  - Instalar tipagem: `yarn add @types/styled-components`\n\n5. Adicionar **Next Images**: `yarn add next-images`\n\n6. Adicionar **Inline React-SVG**: `yarn add babel-plugin-inline-react-svg -D`\n\n","funding_links":[],"categories":[],"sub_categories":[],"project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fvitorserrano%2Freactsetup","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fvitorserrano%2Freactsetup","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fvitorserrano%2Freactsetup/lists"}