Table of Contents

React.js (리액트)

Quick start

Preparings

Install Node.js on Ubuntu

  • Install Node.js on Ubuntu 
    # to install node.js we need CURL
$ sudo apt install -y curl

# install node.js using apt package manager
$ sudo apt update & sudo apt upgrade -y
$ sudo apt install nodejs
$ nodejs -v
$ sudo apt install npm
$ npm -v

# using PPA
$ curl -sL https://deb.nodesource.com/setup_18.x -o nodesource_setup.sh  # version 18.x
$ sudo bash nodesource_setup.sh 
$ sudo apt-get install nodejs
$ sudo apt-get install build-essential
  • nvm 
    $ curl -o- https://raw.githubusercontent.com/nvm-sh/nvm/v0.39.3/install.sh | bash
$ source ~/.bashrc
$ nvm list-remote
$ nvm install <version>
$ nvm list
$ nvm use <version>
  • npm update 
    $ npm install -g npm@latest
$ npm -v
· 2023/01/03 09:54 · alex

Getting Started

Hello, World

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8" />

    <title>Hello React!</title>

    <script src="https://unpkg.com/react@16/umd/react.development.js"></script>
    <script src="https://unpkg.com/react-dom@16/umd/react-dom.development.js"></script>
    <script src="https://unpkg.com/babel-standalone@6.26.0/babel.js"></script>
  </head>

  <body>
    <div id="root"></div>

    <script type="text/babel">
      class App extends React.Component {
        render() {
          return <h1>Hello world!</h1>
        }
      }

      ReactDOM.render(<App />, document.getElementById('root'))
    </script>
  </body>
</html>

Concepts

References