본문으로 건너뛰기

애플리케이션 생성

이 가이드는 프런트엔드, 데이터베이스, API 서비스를 아우르는 초기 설정에 대한 개요를 제공합니다. 새로운 풀스택 애플리케이션을 빠르고 간편하게 만들어 보겠습니다.

소개​

플랫폼은 폴리글랏이며 다양한 프로그래밍 언어를 지원하지만, 이 튜토리얼에서는 JavaScript 사용에만 집중하겠습니다. 그 결과, 모달 창(팝업)에 표시되는 폼과 데이터를 PDF로 내보내는 기능으로 구성된 실용적인 애플리케이션을 만들게 됩니다.

사전 요구 사항​

시작하기 전에 다음 사항을 확인하세요:

  • Netuno 플랫폼이 컴퓨터에 미리 설치되어 있어야 합니다. 이 단계에서 궁금한 점이 있으면 플랫폼 설치 가이드를 참고하세요.

  • 개발 환경의 터미널 또는 명령 프롬프트에 접근할 수 있어야 합니다.

새 애플리케이션 생성​

새 애플리케이션을 초기화하려면 아래 지침을 따르세요:

터미널을 열고 Netuno가 설치된 루트 폴더로 이동합니다.

애플리케이션 생성 명령을 실행합니다:

./netuno app

매개변수를 사용한 생성​

명령을 실행할 때 애플리케이션 이름을 직접 정의할 수 있습니다. 예:

./netuno app name=my_application
이름 지정 모범 사례

애플리케이션 이름을 정의할 때 공백, 악센트 문자 또는 특수 문자를 피하세요. 시스템 URL 및 폴더와의 호환성을 유지하려면 하이픈이나 밑줄로 구분된 소문자를 사용하는 것이 좋습니다(예: app-sales 또는 hr_management).

초기 설정​

명령줄 마법사가 프로젝트를 구성하기 위해 몇 가지 질문을 합니다. 다음을 입력하세요:

  • 애플리케이션 이름: 프로젝트의 식별자입니다.
  • 데이터베이스 유형: 사용할 데이터베이스 관리 시스템입니다.
  • 언어: 애플리케이션 인터페이스의 기본 언어입니다.
팁 및 모범 사례

초보자를 위한 데이터베이스 추천

단계별 진행 중 데이터베이스 유형을 묻는 질문이 나오면 H2 Database 옵션을 선택하는 것을 권장합니다.

H2 Database는 Netuno 서버에 이미 통합되어 제공되는 내장 데이터베이스입니다. 큰 장점은 PostgreSQL이나 MySQL 같은 외부 서버의 설치나 구성이 필요 없다는 점으로, 초기 개발과 테스트를 훨씬 실용적이고 빠르게 만들어 줍니다.

서버 시작 명령​

새 애플리케이션을 만든 후 Netuno 플랫폼 서버를 시작합니다. 그러면 프로젝트를 브라우저에서 접근할 수 있으며 지속적인 개발을 위한 준비가 완료됩니다.

터미널에서 아래 명령을 실행하고 초기화가 완료될 때까지 기다립니다.

./netuno server app=my_application

app=my_application 매개변수를 전달하면 서버는 이것이 해당 인스턴스에서 실행할 기본 애플리케이션이라고 인식합니다. 서버가 실행 중이면 바로 프로젝트 편집을 시작할 수 있습니다.

애플리케이션의 모든 파일과 소스 코드는 📂 apps/myapp 폴더 안에 저장되고 정리됩니다.

접속 자격 증명 (Backoffice)

애플리케이션의 관리 인터페이스인 Backoffice에 처음 접속하면 시스템이 인증을 요청합니다. 로컬 개발 환경에서는 다음 기본 자격 증명을 사용하세요:

사용자: dev

비밀번호: dev

애플리케이션을 운영 환경으로 이전할 때는 이 자격 증명을 변경할 것을 권장합니다.

코드 편집기​

최상의 개발 경험을 보장하기 위해 가볍고 확장 생태계가 잘 갖춰진 최신 코드 편집기를 사용하는 것을 제안합니다.

아직 즐겨 사용하는 편집기가 없다면 커뮤니티에서 널리 사용되는 다음 무료 옵션을 권장합니다:

참고: 더 강력한 도구를 선호하고 라이선스 비용 지불을 꺼리지 않는다면 JetBrains의 WebStorm이 훌륭한 프리미엄 선택입니다.

편집기에서 애플리케이션 폴더를 엽니다:

  • 📂 apps/my_application

애플리케이션의 모든 파일은 이 폴더 안에 저장되고 정리됩니다. 라우트 생성, 데이터베이스 로직, 시각적 인터페이스를 포함한 모든 개발은 이 폴더 안에서 이루어집니다.

아키텍처 이해하기

각 파일 유형을 정확히 어디에 만들어야 하는지, Netuno가 백엔드와 프런트엔드를 어떻게 구성하는지 알고 싶다면 애플리케이션 폴더 구조에 대한 상세 문서를 읽어 보시기 바랍니다:

가이드 참고: 애플리케이션 폴더

단계 요약​

Netuno의 기본 지식을 다졌으니, 이제 이 개념들을 실제로 적용하여 처음부터 끝까지 완전한 기능을 만들어 보겠습니다.

실습 목표는 인터페이스에 두 개의 새로운 대화형 컴포넌트를 추가하는 것입니다:

  • 고객 폼을 플로팅 창(Modal) 안에 불러와 표시하는 버튼.
  • 등록된 고객 목록을 PDF 파일로 생성하고 내보내는 전용 버튼.

이 결과를 체계적이고 명확하게 달성하기 위해 개발 과정을 논리적인 단계 순서로 나누었습니다. 다음 순서를 따르겠습니다:

  • 인터페이스 매핑: 대시보드의 주요 HTML이 어디에 정의되어 있는지 찾기 위해 애플리케이션 폴더 구조를 분석합니다.

  • React 통합: 프런트엔드에서 React 프레임워크를 사용하여 두 개의 새로운 버튼의 기반을 구성하고 추가합니다.

  • Modal 로직: 고객 폼을 올바르게 열기 위한 버튼 동작을 구축하고 프로그래밍합니다.

  • 내보내기 인터페이스: 인터페이스에서 PDF 파일 다운로드를 트리거할 버튼을 구축하고 배치합니다.

  • 서비스(API) 개발: 데이터를 읽고 고객 목록이 담긴 PDF 파일을 동적으로 생성하는 서비스를 만들어 백엔드를 프로그래밍합니다.

시작해 봅시다!

대시보드 템플릿​

server/templates 폴더로 이동하여 대시보드 화면의 HTML을 제공하는 파일을 엽니다.

server/templates/dashboard.html

dashboard.html 파일의 코드를 살펴보며 페이지 끝까지 스크롤하세요. 독립된 <div> 요소를 발견할 수 있습니다. 바로 이 지점에서 Netuno 플랫폼이 React로 구축된 모든 대화형 인터페이스를 "주입"하고 시작합니다.

server/templates/dashboard.html
...
<div id="app-dashboard"></div>

HTML 뼈대는 server/templates 폴더에 있지만, 실제 인터페이스 개발과 시각적 로직은 그곳에서 이루어지지 않습니다.

대시보드의 동작을 변경하거나 React로 새로운 컴포넌트를 추가하려면 프런트엔드 개발 전용 폴더에 접근해야 합니다.

바로 이 📂 ui/ 폴더에서 대시보드 컴포넌트를 찾고 애플리케이션의 새로운 시각적 기능을 개발할 수 있습니다.

폼 생성​

이 단계에서는 이 튜토리얼에 필요한 데이터베이스 구조를 만듭니다. 즉, Name이라는 텍스트 필드를 포함하는 Customer라는 폼을 만듭니다.

  • Backoffice에서 오른쪽 상단의 구성 버튼을 클릭하여 개발 영역으로 이동합니다.
  • 측면 메뉴에서 관리 > 폼으로 이동하여 제목: Customer로 새 폼을 만듭니다.
  • 저장을 클릭합니다.

테이블 이름은 자동으로 customer로 채워집니다(데이터베이스에 권장되는 방식대로 소문자로 유지합니다).

가이드 참고

이 화면의 고급 설정에 대해 궁금한 점이 있으면 **폼**의 전체 문서를 참고하세요.

필드 생성​

폼을 만들면 왼쪽 측면 메뉴의 필드 카테고리에 나타납니다.

  • Customer를 클릭하여 새 컬럼을 추가합니다:
  • 필드 제목에 "Name" 텍스트를 입력합니다.
  • 유형 필드에서 데이터 유형을 **"text"**로 선택합니다.
  • 필터 허용(검색 활성화)과 결과에 표시(테이블에 표시) 옵션을 선택합니다.
  • 저장을 클릭합니다.
가이드 참고

사용 가능한 모든 데이터 유형과 그 속성을 이해하려면 **필드**의 상세 문서를 참고하세요.

테스트 데이터 삽입​

다음 단계에서 PDF 내보내기를 테스트하려면 시스템에 실제 데이터가 필요합니다.

  • 오른쪽 상단의 보기 버튼을 클릭하여 애플리케이션 사용 Backoffice로 돌아갑니다.
  • 측면에서 새로 만든 Customer 메뉴로 이동합니다.
  • + 추가 버튼을 사용하여 시스템에 몇 명의 테스트 고객을 등록합니다.
  • 저장을 클릭합니다.

데이터베이스 조회​

Netuno는 애플리케이션 데이터베이스에서 SQL 명령을 직접 실행할 수 있는 통합 도구를 제공합니다. 빠른 조회, 정보 검증, 시스템 데이터의 신속한 조작에 필수적입니다.

쿼리 인터페이스에 접근하여 명령을 실행하려면 아래 단계를 따르세요:

  • 메인 인터페이스에서 구성 버튼을 클릭하여 개발 영역으로 이동합니다.
  • 측면 탐색 메뉴에서 관리 섹션을 찾습니다.
  • Query 옵션을 클릭하여 데이터베이스 콘솔을 엽니다.
  • 화면에 나타나는 텍스트 편집기에 실행할 SQL 명령을 입력합니다.
  • 명령 실행을 확인합니다.

등록된 고객을 조회하려면 아래 명령을 실행하세요:

SELECT * FROM customer

조회를 마치고 시스템의 사용자 인터페이스(backoffice)로 돌아가려면 보기 버튼을 클릭하면 됩니다.

React로 버튼 추가​

이 단계에서는 dashboard 패널의 주요 파일을 구성하여 두 개의 새로운 버튼을 표시합니다.

인터페이스 아키텍처에서는 더 큰 기능을 포함하고 여러 개의 작은 컴포넌트를 그룹화하는 시스템의 광범위한 영역을 정의하기 위해 Containers 개념을 사용합니다.

  • 코드 편집기에서 📂 ui/src/containers 폴더로 이동합니다.

  • 대시보드의 주요 파일을 찾아 엽니다: 📂 DashboardContainer/index.jsx.

  • 아래 예시와 같이 컴포넌트를 가져오고 렌더링하는 코드를 삽입합니다.

ui/src/containers/DashboardContainer/index.jsx
import { Space } from 'antd';

import CustomerModalButton from '../../components/CustomerModalButton';
import PdfButton from '../../components/PdfButton';

import "./index.less";

function DashboardContainer() {
return (
<div className="my-dashboard">
<Space>
<CustomerModalButton />
<PdfButton />
</Space>
</div>
);
}

export default DashboardContainer;

이 버튼 파일들은 아직 프로젝트에 실체가 없다는 점에 주목하세요. 이들은 더 작고 재사용 가능한 컴포넌트이므로 전용 컴포넌트 폴더 안에 만들겠습니다.

아키텍처 구성

항상 Containers(전체 페이지나 대시보드 같은 광범위한 범위의 영역)와 Components(버튼, 모달 같은 격리된 인터페이스 요소)의 분리를 유지하세요. 이렇게 하면 Netuno의 코드가 훨씬 깔끔하고 유지보수가 쉬우며 확장 가능해집니다.

폼 버튼​

ui/src/components/ 폴더로 이동하여 CustomerModalButton이라는 새 폴더를 만듭니다.

CustomerModalButton 폴더 안에 index.jsx라는 이름의 주요 컴포넌트 파일을 만듭니다.

📂 ui/src/components/CustomerModalButton/index.jsx

파일을 열고 아래 코드를 삽입합니다:

ui/src/components/CustomerModalButton/index.jsx
import { Button } from 'antd';

function CustomerModalButton() {
const onClick = () => {
netuno.modal.create({
name: 'customer',
callback: function (modal) {
let form = modal.find('[netuno-form]');

form.on('netuno:new', () => {
console.log('새 고객을 생성합니다.');
});

form.on('netuno:save', () => {
netuno.modal.hide(modal)
console.log('고객을 저장했습니다.');
});

form.on('netuno:delete', () => {
netuno.modal.hide(modal)
console.log('고객을 삭제했습니다.');
});

form.on('netuno:back', () => {
console.log('뒤로 가기를 클릭했습니다.');
});

netuno.loadForm(form);
netuno.modal.show(modal);
}
});
};
return (
<div>
<Button type="primary" onClick={ onClick }>
고객 폼 열기
</Button>
</div>
);
}

export default CustomerModalButton;

코드 이해하기​

이 컴포넌트의 마법은 Netuno의 전역 인터페이스 도구를 사용하는 onClick 함수 안에서 일어납니다:

  • netuno.modal.create(): 이 메서드는 화면에 모달 창을 인스턴스화하고 원하는 폼(이 경우 customer라는 폼)을 연결합니다.

  • 폼 이벤트(form.on): callback 블록을 통해 사용자 동작을 "수신"(listen)할 수 있습니다. 사용자가 레코드를 생성(netuno:new)하거나, 저장(netuno:save)하거나, 삭제(netuno:delete)하거나, 뒤로 가기(netuno:back)를 클릭할 때 사용자 정의 동작을 실행할 수 있습니다.

  • netuno.modal.hide() / show(): 성공적인 동작 후 모달을 숨기거나 폼이 로드되는 즉시 모달을 표시하는 데 사용되는 메서드입니다.

통합 완료

이제 CustomerModalButton 컴포넌트가 성공적으로 생성되었으므로, 앞서 DashboardContainer에서 수행한 import가 오류 없이 동작하고 버튼이 화면에 렌더링됩니다!

PDF 내보내기 버튼​

이 단계에서는 Dashboard의 두 번째 버튼인 PDF 내보내기 버튼을 만듭니다.

인터페이스에서 이 컴포넌트의 주요 기능은 트리거 역할입니다. 즉, 클릭하면 백엔드 서비스에 요청을 보내고, 백엔드 서비스는 시스템 데이터를 처리하여 등록된 고객 목록이 담긴 PDF 파일을 생성합니다.

  • ui/src/components/ 폴더로 이동하여 PdfButton이라는 새 폴더를 만듭니다.

  • 폴더 안에 index.jsx라는 파일을 만듭니다.

ui/src/components/PdfButton/index.jsx

파일을 열고 아래 코드를 삽입합니다:

ui/src/components/PdfButton/index.jsx
import { Button } from 'antd';

function PdfButton() {
return (
<div>
<Button
type="primary"
href="/services/customer/export-pdf"
target="blank">
PDF 내보내기
</Button>
</div>
);
}

export default PdfButton;

PdfButton 컴포넌트가 생성됨에 따라 DashboardContainer에 선언된 두 버튼이 모두 준비되었습니다.

다음 단계

시각적 구조와 컴포넌트가 완료되었습니다. 인터페이스 렌더링을 테스트하려면 프런트엔드를 컴파일하세요.

실제로 PDF를 생성하는 백엔드 서비스 구축은 다음 단계에서 다룹니다.

프런트엔드 컴파일​

인터넷 브라우저는 React로 작성된 .jsx 또는 .tsx 파일이나 .less 같은 CSS 전처리기를 기본적으로 이해하지 못합니다. 인터페이스가 올바르게 동작하려면 컴파일(build) 과정을 거쳐야 합니다. 이 과정은 브라우저가 최대 효율로 처리할 수 있는 최종 정적 파일(표준 JavaScript 및 CSS)로 코드를 변환, 번들링, 최적화합니다.

사전 요구 사항​

컴파일을 시작하기 전에 다음을 확인하세요:

  • 개발 환경에서 터미널 또는 명령 프롬프트가 열려 있어야 합니다.

  • 패키지 관리자 Bun이 시스템에 올바르게 설치되어 있어야 합니다.

컴파일 예시​

Netuno는 개발 단계에 따라 다양한 명령을 제공합니다. Netuno 루트 폴더에서 애플리케이션의 ui 폴더로 이동합니다.

애플리케이션의 인터페이스 폴더 안에서 명령을 실행합니다: 📂 apps/myapp/ui

프로덕션 컴파일​

파일을 완전하고 최적화된 형태로 컴파일합니다. 화면이나 컴포넌트 개발을 마치고 가볍고 성능이 좋은 최종 파일을 생성하고자 할 때 이상적인 명령입니다.

bun run build

개발 컴파일​

watch 명령은 빠르게 컴파일하고 폴더를 계속 관찰합니다. 편집기에서 파일을 저장할 때마다 터미널이 자동으로 컴파일을 실행합니다.

bun run watch

build든 watch든 어떤 명령을 사용하더라도 변경 사항이 사용자 화면에 즉시 나타나지는 않습니다. 생성된 새 파일을 로드하려면 브라우저에서 backoffice 페이지를 새로고침하세요.

오류 모니터링 및 디버깅

개발 중에는 서로 다른 두 단계에서 오류가 발생할 수 있습니다. 어디에서 찾아야 하는지 알아 두세요:

  • 컴파일 오류: React 코드의 구문 오류나 선언되지 않은 변수는 bun 명령이 실행 중인 터미널에 직접 표시됩니다.

  • 실행 오류: 애플리케이션 사용 중에 발생하는 오류는 브라우저 콘솔에 표시됩니다. 항상 페이지를 검사하여 경고나 오류가 있는지 확인하는 것을 잊지 마세요.

통합 컴파일​

통합 컴파일 기능은 서버 시작과 함께 터미널 명령을 자동으로 실행할 수 있게 해 줍니다. 이를 통해 모든 로그와 모니터링을 하나의 중앙 터미널로 통합하여 워크플로를 최적화합니다.

통합 컴파일을 활성화하려면 애플리케이션의 개발 설정을 수정해야 합니다:

  • 애플리케이션의 루트 폴더로 이동합니다.

  • 개발 구성 파일을 엽니다: _development.json.

  • "commands"에 해당하는 코드 블록을 찾습니다.

  • "enabled" 속성 값을 false에서 true로 변경합니다.

  • 파일을 저장합니다.

_development.json 파일은 다음과 유사한 구조가 되어야 합니다:

config/_development.json
...
"commands": [{
"command": "bun run watch",
"enabled": true,
"install": "bun install",
"path": "ui"
}],
...

Netuno가 업데이트된 파일을 읽고 새 구성을 적용하려면 서버를 재시작해야 합니다:

  • Netuno 서버가 실행 중인 터미널로 이동합니다.

  • CTRL + C 키를 동시에 눌러 프로세스를 종료합니다.

  • 애플리케이션 이름을 지정하여 서버를 다시 시작합니다:

./netuno server app=myapp
단일 터미널

서버를 재시작한 후 터미널의 로그를 확인하세요. Netuno가 이제 백그라운드에서 프런트엔드 컴파일 명령 bun run watch를 자동으로 실행하고 있음을 알 수 있습니다. 이제부터 모든 것이 같은 창에서 통합되어 동작합니다.

PDF 생성을 위한 API 서비스​

이전 단계에서 프런트엔드의 PDF 내보내기 버튼에 "href" 속성이 services/customer/export-pdf 주소를 가리키도록 구성했습니다. 하지만 지금 클릭하면 아무 일도 일어나지 않습니다. 파일을 생성하는 API 서비스가 아직 존재하지 않기 때문입니다.

API 개발은 모두 📂 server 폴더 안에서 이루어집니다. 이 섹션에서는 데이터베이스에서 레코드를 조회하고 PDF 문서를 시각적으로 구성하는 스크립트를 만들겠습니다.

사전 요구 사항​

  • 올바른 URL을 가리키는 PdfButton 컴포넌트를 프런트엔드에 생성했어야 합니다.
  • Netuno 서버가 실행 중이어야 합니다.

Netuno는 server/services/ 내부의 폴더 구조를 기반으로 API의 URL을 자동으로 라우팅합니다. 서비스를 만들려면 다음 단계를 따르세요:

  • 백엔드의 서비스 폴더로 이동합니다: server/services/. customer라는 폴더를 만듭니다.

  • 그 폴더 안에 export-pdf.js라는 파일을 만듭니다.

Netuno는 폴리글랏입니다. 이 예시에서는 JavaScript를 사용하지만, 선호하는 언어에 해당하는 확장자를 사용하세요.

파일을 열고 PDF 구조를 생성하는 아래 코드를 삽입합니다:

  • server/services/customer/export-pdf.js
server/services/customer/export-pdf.js
_header.contentType("pdf")

const pdfDocument = _pdf.newDocument(_pdf.pageSize("A5"))

pdfDocument.add(
_pdf.paragraph("고객 목록:")
.setFontSize(16)
.setFontColor(_pdf.color("#1abc9c"))
)

const dbCustomers = _db.form("customer").all()

for (const dbCustomer of dbCustomers) {
pdfDocument.add(
_pdf.paragraph(dbCustomer.getString("name"))
.setFontSize(12)
.setFontColor(_pdf.color("#748dae"))
)
}

pdfDocument.close()

코드 이해하기​

  • _header.contentType("pdf"): 이 요청의 응답이 일반 텍스트나 JSON이 아니라 PDF 파일임을 브라우저에 알립니다.

  • _pdf: PDF 조작을 위한 Netuno의 네이티브 리소스입니다. 이를 통해 페이지 크기(A5)를 정의하고, 문단을 만들고, 글꼴 크기(setFontSize)와 색상(setFontColor)을 조정합니다.

  • _db.form("customer").all(): 데이터베이스를 조회하고 "customer" 폼에 저장된 모든 레코드를 반환합니다. 반복문(for)이 각 고객을 순회하며 "name" 필드의 정보를 추출하여 문서에 출력합니다.

  • pdfDocument.close(): 문서 구성을 마치고 이를 응답으로 전송합니다.

검증 및 테스트​

서비스를 테스트할 때마다 대시보드 버튼을 클릭할 필요는 없습니다. 단순한 요청(GET)이므로 브라우저에서 API URL에 직접 접근하여 실행을 검증할 수 있습니다.

이 예시에서는 다음 주소로 접속하세요: http://localhost:9000/services/customer/export-pdf

PDF 파일이 생성되어 고객 목록이 담긴 채로 화면에 표시된다면 서비스가 완벽하게 동작하는 것입니다! 결과적으로 Dashboard의 PDF 내보내기 버튼도 자동으로 동작하게 됩니다.

백엔드 오류 추적

URL에 접속했을 때 페이지가 비어 있거나 오류 메시지가 반환된다면 즉시 Netuno 서버가 실행 중인 터미널을 확인하세요. 오류가 브라우저 콘솔에 표시되는 프런트엔드와 달리, server 폴더의 스크립트에서 발생하는 모든 실행 오류는 백엔드 서버 터미널에 상세하게 표시됩니다.

결론​

이 튜토리얼에서 여러분은 Netuno를 활용한 실습 중심의 풀스택 개발 여정을 경험했습니다.

주요 목표는 플랫폼이 시각적 인터페이스 구축과 서버의 견고함을 어떻게 통합하는지 보여 주는 것이었으며, 항상 높은 생산성에 초점을 맞췄습니다.

완료한 단계를 되돌아보면:

  • 프런트엔드 개발: React로 대시보드를 커스터마이즈하며 인터페이스 컴포넌트와 대화형 버튼을 모듈 방식으로 만들었습니다.

  • 데이터 관리 및 구조: 복잡한 영속성 루틴을 작성하지 않고도 패널에서 폼과 필드를 만들어 정보를 등록하고 조작하는 것이 얼마나 빠른지 확인했습니다.

  • 직접 조회: Query 기능을 사용하여 SQL 명령을 신속하게 실행하며 데이터베이스를 테스트했습니다.

  • 백엔드 API 생성: PDF 생성을 위한 서비스를 개발하고 Netuno의 큰 장점 중 하나인 핫 리로드(hot-reload)를 확인했습니다. 백엔드 코드를 변경할 때마다 서버를 재시작할 필요가 없어 프로그래밍 속도가 크게 향상됩니다.

  • 최적화된 환경: 통합 컴파일을 구성하여 프런트엔드와 백엔드 프로세스를 하나의 터미널로 중앙화함으로써 집중력을 유지하고 방해 요소를 피할 수 있었습니다.

이 플랫폼은 소프트웨어 개발을 최적화하고 가속화하기 위해 본질적으로 설계되었습니다. 이제 로우코드와 커스텀 코드 간의 기본적인 통합 흐름을 이해했으니, 훨씬 더 복잡하고 확장 가능한 애플리케이션을 구축할 준비가 되었습니다.

새로운 기능을 익히려면 문서의 다음 섹션들을 계속 탐색해 보세요.

활발한 커뮤니티의 일원이 될 때 개발은 훨씬 쉬워집니다. 이 페이지 하단의 소셜 미디어 링크를 방문해 보세요.