Setup next and test index page #5

Manuel-Antunes · 2021-04-28T02:44:47Z

the first step to finish the #1, here the nextjs is setup and is served a page with metadata

danielfireman · 2021-04-28T13:01:36Z

README.md

@@ -1,2 +1,34 @@
-# sitenovo
-Site do projeto DadosJusBR
+This is a [Next.js](https://nextjs.org/) project bootstrapped with [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app).


Fico feliz demais em ver esse começo do readme em inglês, mas gostaria que mudasse para português. Achamos que vai diminuir a barreira para devs brasileiros é importante pra colaboração.

Eita professor, é que esse readme é gerado pelo próprio next, mas eu vou altera-lo

danielfireman · 2021-04-28T13:02:04Z

README.md

@@ -1,2 +1,34 @@
-# sitenovo
-Site do projeto DadosJusBR
+This is a [Next.js](https://nextjs.org/) project bootstrapped with [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app).


O começo da página pode falar um pouco do projeto. Pode ter um parágrafo extraído do repo site ou do próprio site atual: dadusjusbr.org

danielfireman · 2021-04-28T13:02:36Z

README.md

+
+## Getting Started
+
+First, run the development server:


Listar dependências e explicar que elas serão instaladas automaticamente no gitpod.

danielfireman · 2021-04-28T13:03:15Z

README.md

+
+You can start editing the page by modifying `pages/index.js`. The page auto-updates as you edit the file.
+
+[API routes](https://nextjs.org/docs/api-routes/introduction) can be accessed on [http://localhost:3000/api/hello](http://localhost:3000/api/hello). This endpoint can be edited in `pages/api/hello.js`.


Não teremos API na primeira versão

danielfireman · 2021-04-28T13:03:31Z

README.md

+
+You can check out [the Next.js GitHub repository](https://github.com/vercel/next.js/) - your feedback and contributions are welcome!
+
+## Deploy on Vercel


Remover essa seção.

danielfireman · 2021-04-28T13:05:49Z

public/vercel.svg

@@ -0,0 +1,4 @@
+<svg width="283" height="64" viewBox="0 0 283 64" fill="none" 


Pra que queremos esse arquivo?

danielfireman · 2021-04-28T13:07:53Z

pages/index.tsx

@@ -0,0 +1,9 @@
+import Head from 'next/head'


Você não está fazendo nada com o header. Pode remover esse import e colocar depois

https://nextjs.org/docs/api-reference/next/head

danielfireman · 2021-04-28T13:08:28Z

pages/index.tsx

@@ -0,0 +1,9 @@
+import Head from 'next/head'
+
+export default function Home() {


Suggested change

export default function Home() {

export default function Index() {

Vai ficar mais fácil de entender se a gente tiver a função pública com o mesmo nome do arquivo, né?

danielfireman · 2021-04-28T13:11:07Z

pages/_app.tsx

@@ -0,0 +1,6 @@
+


Pode colocar um comentário explicando por que esse arquivo está aqui. Inclusive, colocar essa URL https://nextjs.org/docs/advanced-features/custom-app

Imagino que você já sabia que vai usar aspectos mais avançados, por isso já está colocando ele. Caso não tenha nada em mente, pode removê-lo.

danielfireman · 2021-04-28T13:13:02Z

README.md

+First, run the development server:
+
+```bash
+npm run dev


Se entendi bem, você está usando yarn e está comitando o arquivo yarn.lock e ele serve para garantir versões entre implantações (fonte). Dito isso, não devemos usar somente yarn?

Sim e não, pq o yarn ele vai estar funcionando de forma integrada com o npm, e normalmente nos ambientes de produção não é instalado o yarn, apenas o npm, mas claro, eu posso deixar tudo bonitinho pra funcionar só com o yarn se form preferível

README.md

danielfireman · 2021-04-29T23:48:50Z

next-env.d.ts

@@ -0,0 +1,2 @@
+/// <reference types="next" />
+/// <reference types="next/types/global" />


Pode adicionar uma linha comentada com esse link: https://nextjs.org/docs/basic-features/typescript

Mostrando onde podemos mais informações sobre esse arquivo. Ele não é óbvio.

public/img/hover_beneficios-1.svg

src/components/Nav/index.tsx

src/pages/_document.tsx

danielfireman · 2021-04-30T00:01:47Z

src/components/Nav/index.tsx

@@ -0,0 +1,30 @@
+import React from 'react';


Precisamos mesmo do subdiretório Nav? Caso contrário, vamos prosseguir colocando a maior parte da coisas na raiz e só criando diretórios quando necessário. Não há problema em cirar subdiretórios, porém acho que devemos ir criando quando for necessário.

Eu acredito que sim, pois ele é uma partial (componente reutilizável) e vou estar usando ele em mais de uma page, e como eu uso esse padrão modular de pastas pra conseguir deixar os partials mais reutilizáveis eu acho que é um padrão interessante, aí tipo, importante citar tbm que o nav é reutilizado em N lugares na aplicação, então não torna-lo um partial seria uma reutilização desnecessária de código

Duas perguntas diretas. Caso prefira, podemos conversar via fone ou VC.

Os diretórios são necessários para criação de componnte?

Quais as vantagens de usar subdiretórios em Next.js?

Outro ponto interessante:

Quando comparo com esse projeto template para Next.js, noto que não precisa do diretório src.

Se o senhor quiser podemos marcar uma pequena reunião para eu tirar essas dúvidas mais estruturais, se o senhor tiver tempo é claro

danielfireman · 2021-04-30T00:02:13Z

src/styles/global.ts

@@ -0,0 +1,18 @@
+import { createGlobalStyle } from 'styled-components';
+


chamar o arquivo de global_style ou mover para dentro de syle.tsx

next-env.d.ts

src/pages/_document.tsx

README.md

src/components/Nav/index.tsx

danielfireman · 2021-04-30T12:13:22Z

src/components/Nav/index.tsx

@@ -0,0 +1,30 @@
+import React from 'react';


Duas perguntas diretas. Caso prefira, podemos conversar via fone ou VC.

Os diretórios são necessários para criação de componnte?

Quais as vantagens de usar subdiretórios em Next.js?

Outro ponto interessante:

Quando comparo com esse projeto template para Next.js, noto que não precisa do diretório src.

Co-authored-by: Daniel Fireman <[email protected]>

…adosjusbr/site-novo into setup-next-and-test-index-page

Co-authored-by: Daniel Fireman <[email protected]>

danielfireman · 2021-04-30T22:10:08Z

src/components/Header.tsx

@@ -0,0 +1,81 @@
+import React from 'react';
+import Link from 'next/link';


mover pasta components para o diretório raiz

danielfireman · 2021-04-30T22:10:52Z

src/pages/_app.tsx

@@ -0,0 +1,18 @@
+import GlobalStyle from '../styles/global_style';
+
+/*


mover pasta pages para diretório raiz

danielfireman · 2021-04-30T22:15:41Z

src/styles/global_style.ts

@@ -0,0 +1,18 @@
+import { createGlobalStyle } from 'styled-components';
+
+export default createGlobalStyle`


Mover global_style.tsx para /pages

Manuel-Antunes added 3 commits April 27, 2021 21:02

feat: setup nextjs framework in typescript

1b7fa7f

feat: setup eslint

ce024bb

feat: setup editor config

e05223a

Manuel-Antunes requested a review from danielfireman April 28, 2021 02:44

Manuel-Antunes linked an issue Apr 28, 2021 that may be closed by this pull request

Criar página inicial #1

Closed

danielfireman requested changes Apr 28, 2021

View reviewed changes

Manuel-Antunes added 7 commits April 28, 2021 14:12

fix: eslint fixes

9e67be6

feat: setup assets and styled components

aea76c1

feat: navbar proto is ready

a3f87f4

fix: index page using the name "index" in the main function

f0e1ee1

fix: using dadosjus old readme to improve the new readme

1f79cf6

chore: deps list in readme

641e260

chore: responsive nav

a1e416a

Manuel-Antunes requested a review from danielfireman April 29, 2021 20:41

Manuel-Antunes self-assigned this Apr 29, 2021

danielfireman requested changes Apr 30, 2021

View reviewed changes

Manuel-Antunes added 4 commits April 29, 2021 23:01

fix: change globalstyle file from "global" to "global_style"

565e487

fix: next-env.d.ts explanation

f357895

fix: standardization in the name of the files

35c340a

fix: custom document usage explanation

e632006

danielfireman requested changes Apr 30, 2021

View reviewed changes

Manuel-Antunes and others added 9 commits April 30, 2021 09:31

Update next-env.d.ts with sugestions

b5e8b51

Co-authored-by: Daniel Fireman <[email protected]>

fix: remove React.FC typings

4f5e3a4

Co-authored-by: Daniel Fireman <[email protected]>

fix: getInitialProps suggestion

d692d46

Co-authored-by: Daniel Fireman <[email protected]>

fix: env grammar fixing

76cfbf0

Co-authored-by: Daniel Fireman <[email protected]>

fix: Update next-env.d.ts

a5c3d1f

Co-authored-by: Daniel Fireman <[email protected]>

fix: Update src/pages/_document.tsx

c37c483

Co-authored-by: Daniel Fireman <[email protected]>

fix: Update README.md

2afde9b

Co-authored-by: Daniel Fireman <[email protected]>

fix: Update src/pages/_document.tsx

293cf63

Co-authored-by: Daniel Fireman <[email protected]>

fix: Update src/pages/_document.tsx

f0bf9e9

Co-authored-by: Daniel Fireman <[email protected]>

Manuel-Antunes and others added 4 commits April 30, 2021 15:42

fix: component listing and header

992f2d6

Merge branch 'setup-next-and-test-index-page' of https://github.com/d…

28cfea2

…adosjusbr/site-novo into setup-next-and-test-index-page

fix: remove React.FC typings

bb2a9c8

fix: Update src/pages/_document.tsx

e9bb7dc

Co-authored-by: Daniel Fireman <[email protected]>

Manuel-Antunes requested a review from danielfireman April 30, 2021 19:43

danielfireman approved these changes May 2, 2021

View reviewed changes

Manuel-Antunes merged commit 7314e4f into main May 2, 2021

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Setup next and test index page #5

Setup next and test index page #5

Manuel-Antunes commented Apr 28, 2021

danielfireman Apr 28, 2021

Manuel-Antunes Apr 28, 2021

danielfireman Apr 28, 2021

danielfireman Apr 28, 2021

danielfireman Apr 28, 2021

danielfireman Apr 28, 2021

danielfireman Apr 28, 2021

danielfireman Apr 28, 2021

danielfireman Apr 28, 2021

Manuel-Antunes Apr 29, 2021

danielfireman Apr 28, 2021

danielfireman Apr 28, 2021

Manuel-Antunes Apr 28, 2021

danielfireman Apr 29, 2021

danielfireman Apr 30, 2021

Manuel-Antunes Apr 30, 2021

danielfireman Apr 30, 2021

Manuel-Antunes Apr 30, 2021

danielfireman Apr 30, 2021

Manuel-Antunes Apr 30, 2021

danielfireman Apr 30, 2021

danielfireman Apr 30, 2021

danielfireman Apr 30, 2021

danielfireman Apr 30, 2021


		You can start editing the page by modifying `pages/index.js`. The page auto-updates as you edit the file.

		[API routes](https://nextjs.org/docs/api-routes/introduction) can be accessed on [http://localhost:3000/api/hello](http://localhost:3000/api/hello). This endpoint can be edited in `pages/api/hello.js`.


		You can check out [the Next.js GitHub repository](https://github.com/vercel/next.js/) - your feedback and contributions are welcome!

		## Deploy on Vercel

		@@ -0,0 +1,4 @@
		<svg width="283" height="64" viewBox="0 0 283 64" fill="none"

		@@ -0,0 +1,9 @@
		import Head from 'next/head'

		export default function Home() {

	export default function Home() {
	export default function Index() {

		@@ -0,0 +1,2 @@
		/// <reference types="next" />
		/// <reference types="next/types/global" />

		@@ -0,0 +1,18 @@
		import { createGlobalStyle } from 'styled-components';

		@@ -0,0 +1,81 @@
		import React from 'react';
		import Link from 'next/link';

		@@ -0,0 +1,18 @@
		import GlobalStyle from '../styles/global_style';

		/*

		@@ -0,0 +1,18 @@
		import { createGlobalStyle } from 'styled-components';

		export default createGlobalStyle`

Setup next and test index page #5

Setup next and test index page #5

Conversation

Manuel-Antunes commented Apr 28, 2021

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment