De verdade? Atualiza esse curso... Sério... Já passei umas três horas tentando debugar o erro que dá com esse CSS in JS e o erro permanece acontecendo. Isso é extremamente desgastante quando você quer aprender algo. Não, a documentação não ajuda, não o bard não ajuda. Por favor atualizem o curso, a framework não permite mais CSS-in-JS para componentes renderizados no servidor.
Também já desisti desses cursos pelos erros
O curso aparentemente está abandonado sem nenhuma atualização, já que o next atualizou.
Se o erro for na hora que colocar a HomeScreen na page Home, é basicamente o Link (next-link) que mudou, ele agora não aceita mais componente como um children, ele aceita apenas string, ou seja, ou você comenta a linha 163 (no meu código é essa linha) até a 216, ai a para de dar erro e volta a funcionar. (pelo menos até essa parte do curso) Coloquei meu código comentado abaixo para caso ajude.
{/* <Box>
<Link
href="/faq"
styleSheet={{
display: "inline-flex",
alignItems: {
xs: "flex-start",
sm: "center",
},
flexDirection: {
xs: "column",
sm: "row",
},
}}
>
<Text
styleSheet={{
textVariant: theme.typography.variants.body4,
fontWeight: "600",
borderRadius: theme.space.x64,
color: theme.colors.primary["400"],
backgroundColor: theme.colors.primary["100"],
paddingHorizontal: theme.space['x2.5'],
paddingVertical: theme.space['x1'],
marginRight: theme.space.x2,
marginBottom: {
xs: theme.space.x2,
sm: theme.space.x0
},
}}
>
O que tem de novo?
</Text>
<Text
styleSheet={{
textVariant: theme.typography.variants.body4,
fontWeight: "600",
display: 'inline-flex',
borderRadius: theme.space.x64,
color: theme.colors.primary["400"],
alignItems: 'center',
}}
>
<Text>Confira as principais dúvidas</Text>
<Icon
styleSheet={{
iconVariant: 'chevronRight',
marginLeft: theme.space.xpx,
}}
aria-hidden="true"
/>
</Text>
</Link>
</Box> */}