Seguir os passos das aulas e notei essa diferença do render, esse é o github do meu projeto https://github.com/Berg9724/contador
Você está vendo a versão anterior da nova experiência da Alura que estamos preparando para você. Em breve, ela ganha uma identidade visual novinha totalmente pensada em potencializar seus estudos!
Seguir os passos das aulas e notei essa diferença do render, esse é o github do meu projeto https://github.com/Berg9724/contador
Olá, Gleidson!
O erro está relacionado ao uso do ReactDOM.render, que foi marcado como preterido (deprecated) na versão mais recente do React. A partir do React 18, a forma recomendada de renderizar o aplicativo mudou.
Você pode resolver esse problema utilizando o novo método createRoot do ReactDOM. Vou mostrar como você pode fazer isso:
import React from 'react';
import ReactDOM from 'react-dom/client';
import './index.css';
import App from './App';
const rootElement = document.getElementById('root')!;
const root = ReactDOM.createRoot(rootElement);
root.render(
<React.StrictMode>
<App />
</React.StrictMode>
);
Isso deve resolver o problema de depreciação que você está enfrentando.
Ou você pode também copiar o arquivo package.json da aula e usar as mesmas versões, mas lembre que a versão do node tem que ser a 14, para que funcione corretamente. Em seguida, cole o código e execute npm i para instalar as dependências.
{
"name": "contador",
"version": "0.1.0",
"private": true,
"dependencies": {
"@testing-library/jest-dom": "^5.14.1",
"@testing-library/react": "^11.2.7",
"@testing-library/user-event": "^12.8.3",
"@types/jest": "^26.0.24",
"@types/node": "^12.20.28",
"@types/react": "^17.0.27",
"@types/react-dom": "^17.0.9",
"alura-studies": "file:",
"contador": "file:",
"react": "^17.0.2",
"react-dom": "^17.0.2",
"react-scripts": "4.0.3",
"typescript": "^4.4.3",
"uuid": "^8.3.2",
"web-vitals": "^1.1.2"
},
"scripts": {
"start": "react-scripts start",
"build": "react-scripts build",
"test": "react-scripts test",
"eject": "react-scripts eject"
},
"eslintConfig": {
"extends": [
"react-app",
"react-app/jest"
]
},
"browserslist": {
"production": [
">0.2%",
"not dead",
"not op_mini all"
],
"development": [
"last 1 chrome version",
"last 1 firefox version",
"last 1 safari version"
]
},
"devDependencies": {
"@types/uuid": "^8.3.1",
"sass": "^1.42.1",
"typescript-plugin-css-modules": "^3.4.0"
}
}
Mas de toda forma o código está funcionando, o que está acontecendo é que o React já não recomenda mais o uso dizendo que está depreciada.
Reforço que em casos de dúvidas, conte sempre com o fórum da comunidade Alura! Bons estudos!
Sucesso ✨
Um grande abraço e até mais!