[nodejs/strapi] 🚀 강력한 headless 프레임워크 strapi 사용해보기 [1/3]

 

https://strapi.io/documentation/developer-docs/latest/getting-started/quick-start.html#_1-install-strapi-and-create-a-new-project

Quick Start Guide - Strapi Developer Documentation

 

강력한 headerless CMS 인 strapi 를 사용해보자!

 

서버에 대한 지식이 전무한 프론트엔드 개발자라면 혼자서 토이프로젝트를 하고자 할 때 api, db 의 대한 지식이 없어 어려움을 겪은 적이 있을 것이다. 

 

strapi 는 프레임워크를 설치, 빌드, 실행 하기만 하면 원하는 엔티티를 생성하고 crud 도 자동으로 생성할 수 있도록 해준다!

써보면서 가장 편리하다고 느꼈던 부분은 admin 페이지가 존재한다는 것이었다.

GUI 화면으로 엔티티를 생성하고 필드의 속성을 구성할 수 있다. 또한 사용자 role 에 따라서 crud 의 퍼미션 설정도 가능하다.

앞으로의 포스팅에서 차근차근 strapi 사용법과 기능을 소개해 보도록 하겠다.

 

---

#1. strapi 설치하기

npm install strapi -g
npm install yarn -g

nodejs 기반으로 npm 을 통해서 strapi 를 global 로 설치하고 yarn 을 사용할 것이므로 yarn 도 설치해 준다.

 

#2. strapi Quick start!

yarn create strapi-app my-project --quickstart

 

기나긴 설치시간이 지나면...... 빌드하고

짠! 서버 실행을 알리는 로그들이 나온다.

동시에 어드민 브라우저도 실행된다!

아래와 같은 화면은 절대 계정을 만들기 위한 회원 등록(?) 화면이다! 

여기서 등록하면 기본설정 디비에 정보가 저장되버리기 소스코드에서 db connection 정보를 수정 후 admin 계정을 등록하도록 하겠다.

strapi admin panel 이 실행된 화면

기본적으로 디비 클라이언트는 sqlite 로 설정되어있다.

앱을 설치한 디렉토리에서 만들어진 파일들을 보면 아래와 같은 소스코드가 생겨있다.

이 부분에서 연결할 db 의 정보들을 설정해주면 된다.

 

- my-project/config/database.js

module.exports = ({ env }) => ({
  defaultConnection: 'default',
  connections: {
    default: {
      connector: 'bookshelf',
      settings: {
        client: 'sqlite',
        filename: env('DATABASE_FILENAME', '.tmp/data.db'),
      },
      options: {
        useNullAsDefault: true,
      },
    },
  },
});

 

#3. db 연동하기 (mysql, docker) 

이 부분은 뒷 포스팅인 docker 환경에서 strapi 실행하기에서 더 자세히 다룰 것이므로 지금은 그냥 sqlite 를 써서 실행하는 것이 좋겠다. (스킵하세용)

 

본 포스팅에서는 mysql 을 연결할 것이므로 도커를 사용해서 mysql 컨테이너를 띄운 후 연결하도록 하겠다.

yarn add mysql --save

 

1) 컨테이너 생성 및 실행

(root 패스워드는 password 로 만들어 주었다.)

docker run --name mysql-container -e MYSQL_ROOT_PASSWORD=password -d -p 3306:3306 mysql:latest

mysql 컨테이너가 띄워진 모습!

 

2) database 만들기

사용하고 있던 gui 가 있다면 connect 한다음에 원하는 이름으로 db 를 생성한다.

아니면 도커 컨테이너 안으로 들어가서 생성해도 된다.

( 나는 tableplus 사용중..)

 

CREATE DATABASE `dev-strapi` DEFAULT CHARACTER SET = `utf8` DEFAULT COLLATE = `utf8_general_ci`;

 

소스코드에도 설정값을 넣어준다.

( .env 에 값을 넣어 관리해도 된다 )

- my-project/config/database.js

module.exports = ({ env }) => ({
  defaultConnection: 'default',
  connections: {
    default: {
      connector: 'bookshelf',
      settings: {
        client: 'mysql',
        host: env('DATABASE_HOST', 'localhost'),
        port: env.int('DATABASE_PORT', 3306),
        database: env('DATABASE_NAME', 'dev-strapi'),
        username: env('DATABASE_USERNAME', 'root'),
        password: env('DATABASE_PASSWORD', 'password'),
        ssl: env.bool('DATABASE_SSL', false),
      },
      options: {}
    },
  },
});

 

4) 실행하기

실행전에 

package.json 파일을 보면 script 들이 만들어져 있는 것을 볼 수 있다.

우리는 로컬에서 실행하기 때문에 

yarn develop

을 사용해서 실행해보자!

 

앗! 무슨일

 

급하게 구글링을 하여 해결했다..

https://1mini2.tistory.com/88

[MySQL 8.0] Nodejs 연동 시 에러 "Client does not support authentication protocol requested by server; consider upgrading My

 

그 다음 다시 실행하면 

처음 앱 설치 했을 때 떴던 admin panel 브라우저가 열리면서 실행되는 걸 볼 수 있다.

 

엔티티 생성, crud 퍼미션 설정은 다음 포스팅에~!