https://github.com/oneted11/react-cdn-scrimba

using react as an add-on
https://github.com/oneted11/react-cdn-scrimba

javascript react react-cdn scrimba-react

Last synced: 12 days ago
JSON representation

using react as an add-on

• Host: GitHub
• URL: https://github.com/oneted11/react-cdn-scrimba
• Owner: Oneted11
• Created: 2022-05-19T07:02:23.000Z (over 2 years ago)
• Default Branch: main
• Last Pushed: 2022-05-19T09:25:09.000Z (over 2 years ago)
• Last Synced: 2024-11-09T09:44:20.690Z (2 months ago)
• Topics: javascript, react, react-cdn, scrimba-react
• Language: HTML
• Homepage:
• Size: 3.91 KB
• Stars: 0
• Watchers: 1
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: readme.md

Awesome Lists containing this project

README

        
### Scrimba react course

# using react and jsx only using CDN

useful for when you dont want a toolchain and just want to add components real quick to an already exsisting html css project

## index.html

```html

  

    

    

    

    React-CDN-Test

  

  

    

    

    

    


    

  


```

## index.js

```jsx

ReactDOM.render(

  

    
HEllo there 

    
 GeneRAl KenoBI

  ,

  document.getElementById("root")

);

```


# Components and Props

This is a thing that is possible apparently in this type of setup :exploding_head:

## index.js

```js

//components

function P1(props) {

  return 
{props.text}
;

}

function P2(props) {

  return 
 {props.text}
;

}


//composing components into page

ReactDOM.render(

  

    

    

  ,

  document.getElementById("root")

);

```

# creating an element using pure js

```js

//create h1

let myhead = document.createElement("h1");

//add text

myhead.textContent = "Hello, React!";

//add class

myhead.classList.add("header");

//select root

let root = document.getElementById("root");

//append to root div

root.appendChild(myhead);

```