React

layout: true
<div class="my-header"></div>
 <div class="my-footer">Andrei Ignat , http://msprogrammer.serviciipeweb.ro/</div>
 
---

class: center, middle

# React- Introductory   =>

( press > )

https://ignatandrei.github.io/Presentations/reactprez.html

Code at 
https://ignatandrei.github.io/Presentations/react.zip
---

# Agenda

0. About me
1. React is a library
2. Framework : CRA - useEffect, useState 
5. Links 
7. Discussion  / Questions ?
---
class: center, top

# About me

![:img ignat, 10%](ignat.jpg)
Andrei Ignat http://msprogrammer.serviciipeweb.ro/

www.ASP.NET forum moderator

YouTube 5 minutes .NET and tools : http://bit.ly/5MinTools

Book Making Open Source Component  : http://bit.ly/NetOpenSourceComponent

Book Copy Paste from StackOverflow : https://amzn.to/2PQ8EDc

Roslyn Source Code Generators with examples :

Amazon: https://amzn.to/3f6gll3

Free:  https://ignatandrei.github.io/RSCG_Examples/

Monthly meetings:  https://www.meetup.com/Bucharest-A-D-C-E-S-Meetup/

---
class: center, top

# React is a library

https://reactjs.org/ "A JavaScript **library** for building user interfaces"

Demo react 1 - in VSCode with run live

Demo react 2- in Babel - send message from parent to child

Also useState see x vs nr

---
class: top

# React Framewors

create-react-app - CRA

Gatsby

Docusaurus

Next.js

React-Static

React native

and many others

---
class: top

# Create React App - CRA

https://create-react-app.dev/

Folder structure

https://create-react-app.dev/docs/folder-structure

Demo CRA, UseState, useEffect

Question: How to send message from 2 cousins ?

---
class: center, top

# Links to get started

https://reactjs.org/