30 React-admin

キレイでシンプルなデザインのReact-adminを入れてみる。

Githubはこちら

FROM node:18.12.1-alpine
WORKDIR /usr/src/app

version: '3'

services:
  node:
    container_name: "react"
    build: .
    volumes:
      - .:/usr/src/app
    command: sh -c 'cd [test-admin] && npm run dev'
    ports:
      - '3000:5173'

※[test-admin]は、アプリ作成で作るアプリ名を入れる

25 Let's Encrypt リバースプロキシで、SSL化して利用する場合

version: '3'

services:
  node:
    container_name: "react"
    build: .
    volumes:
      - .:/usr/src/app
    command: sh -c 'cd test-admin && npm run dev'
    #ports:
    #  - '3000:5173'
    environment:
      - VIRTUAL_HOST=react-admin.fl8.jp
      - VIRTUAL_PORT=5173
      - LETSENCRYPT_HOST=react-admin.fl8.jp
      - CHOKIDAR_USEPOLLING=true
    networks:
      - app_proxy-tier

networks:
  app_proxy-tier:
    external: true

docker-compose build

※[test-admin] は好きなアプリ名を入れる。

docker-compose run --rm node sh -c 'npm create react-admin [test-admin]'

# docker-compose run --rm node sh -c 'npm create react-admin test-admin'
Creating react_node_run ... done
Need to install the following packages:
  create-react-admin@4.16.1
Ok to proceed? (y) 

Select the data provider you want to use, and validate with Enter:
❯ Fakerest
  A client-side, in-memory data provider that use a JSON object as its initial data.

  JSON Server
  A data provider based on the JSON Server API (https://github.com/typicode/json-server)

  Simple REST
  A Simple REST data provider (https://github.com/marmelab/react-admin/tree/master/packages/ra-data-simple-rest)

  None
  I\'ll configure the data provider myself.

↓

Select the auth provider you want to use, and validate with Enter:
❯ Hard coded local username/password
  Hard coded local username/password

  None
  No authProvider

↓

How do you want to install the dependencies?
❯ Using npm

  Using yarn

  Don't install dependencies, I'll do it myself.

↓

Your application test-admin was successfully generated.

To start working, run cd test-admin.
Start the app in development mode by running npm run dev.
You can sign in to the application with the following usernames and password:
- janedoe / password
- johndoe / password

docker-compose up -d

ブラウザで http://[IP]:3000 をアクセス