reactjs hello world
reactjs hello world
===============================
npx create-react-app myapp
cd myapp
npm start
http://localhost:3000/
-----------------------------
* check version
node -v
npm -v
* npm upgrade
npm i -g npm-upgradereactjs hello world
reactjs hello world
===============================
npx create-react-app myapp
cd myapp
npm start
http://localhost:3000/
-----------------------------
* check version
node -v
npm -v
* npm upgrade
npm i -g npm-upgradeReact js tutorial
npx create-react-app my-app
cd my-app
cd src
# If you're using a Mac or Linux:
rm -f *
# Or, if you're on Windows:
del *
# Then, switch back to the project folder
cd ..hello world react
Page HTML :
<div id = "root"> </div>
Page JS BABEL:
ReactDOM.render(<h1> Hello , world ! </h1> , document.getElementById('root') );reactjs basic example
// -------// -------// -------
// index.js
// -------// -------// -------
const user = {
name: "zidane",
email: '[email protected]'
};
const element = <h1> {user.name} exist email: {user.email} </h1>;
const element2 =
<div className="heading">
<h1> {user.name} </h1>
<h1> {user.email} </h1>
</div>;
var numbers = [1,2,3,4];
var doubleNumbers = numbers.map(function(num){
return num * 2 + "; ";
})
var doubleNumberArrowFunction = numbers.map((num) => num * 3 + "; ");
var element3 =
<div>
Double numbers: {doubleNumberArrowFunction}
</div>;
ReactDOM.render(
element3,
// <React.StrictMode>
// <App />
// </React.StrictMode>,
document.getElementById('root')
);
// -------// -------// -------
// ------- index.css ------
// -------// -------// -------
.heading {
padding: 10px;
color: white;
background-color: green;
}Copyright © 2021 Codeinu
Forgot your account's password or having trouble logging into your Account? Don't worry, we'll help you to get back your account. Enter your email address and we'll send you a recovery link to reset your password. If you are experiencing problems resetting your password contact us
