확장 가능한 JavaScript 모놀리식

많은 프로젝트에서 저는 이 스택을 사용하여 가능한 최저 비용으로 신속하게 작업을 완료합니다.

Next JS는 파일 시스템 기반 라우팅 등과 같은 내장 기능을 갖춘 Node와 React를 모두 제공합니다.



클라이언트를 위한 프로젝트를 생성해야 하는 경우(초기 분석 후 이 방식으로 진행하는 데 장애물이나 장애물이 없다고 가정) 다음을 수행합니다.

1- 다음 JS 앱을 만듭니다.

2- 내 VPS(또는 공급자)에 DB 인스턴스를 생성합니다.

3- 적절한 DB 드라이버로 ORM을 추가합니다(저는 Sequelize -주로- 또는 Mongoose를 사용하지만 톤이 있으므로 원하는 것을 선택할 수 있습니다).

4- 데이터 모델을 정의합니다.

5- 유효성 검사 라이브러리를 추가합니다(저는 보통 Joi을 사용하지만 ORM으로 가장 적합한 것을 선택합니다).

6- "pages"안에 "api"디렉토리를 만듭니다.

7- /pages/api/users와 같은 각 백엔드 엔터티에 대한 폴더 추가
index.js 내부는 다음과 같습니다.

switch (req.method) {
    case 'GET':
        return await getAllUsers();
    case 'POST':
        return await createUser();
    default:
        return res.status(405).end(`Method ${req.method} Not Allowed`);
}

8- 페이지 내부에 이 API에 대한 보기를 추가합니다/pages/users.getServerSideProps ( see the API Reference )를 사용하여 이 API에서 원하는 데이터를 가져오고 관련 데이터를 표시합니다.

대신 구성 요소가 필요한 경우 루트에 components/users 와 같은 디렉토리를 만든 다음 페이지에서 React 구성 요소를 가져올 수 있습니다.




프로젝트에 필요한 각 엔터티에 대해 4~8단계를 반복합니다.

Next-PWA을 사용하여 쉽게 PWA로 변환할 수도 있습니다.

모놀리스 확장

아마도 코드와 고객 모두에서 성장할 것이기 때문입니다.

If you already know that this project will need to handle thousands of concurrent requests you may prefer to start with a different architecture but in most cases I face you simply don't know how the project will do. That's because it depends on many factors, most of them are on the client's roof and some of them are not even under client's control.

1- 프로젝트 확장의 첫 번째 단계는 VPS 또는 클라우드 인스턴스의 리소스 양을 늘리는 것입니다. 예를 들어 2개의 vCore와 2Gb의 RAM으로 시작한 경우 앱이 수행하는 작업과 호스팅 공급자 계획에 따라 vCore, RAM 또는 둘 다를 확장해야 할 수 있습니다.

2- 이것이 충분하지 않거나 트래픽이 많을 것으로 예상되는 경우/api/디렉토리를 분할하고 새 인스턴스의 노드 서버에서 실행할 수 있습니다. 이러한 변경에는/api/코드와 프런트엔드 코드 모두에서 약간의 변경이 필요합니다. 예를 들어 다른 것에 대해 localhost에서 호출을 변경하고(env 변수로 처리한 경우 축하합니다! 비용은 2분 정도 소요됨) Express 내부에/api/를 래핑하고 일부 라우팅을 추가합니다.
이 시점에서 우리는 백엔드에서 프런트엔드를 분리했습니다 😁

3- 이것이 충분하지 않으면 API를 청크하고 다른 인스턴스를 통해 제공할 수 있습니다.
앱 내부에 개념적으로 3개의 APIusers, businesses 및 stats가 있고 즐겨 사용하는 모니터링 도구에서 stats가 리소스의 60%를 소비하고 있다고 가정해 보겠습니다. 동일한 단계에 따라 통계를 새 인스턴스로 이동하여 다른 인스턴스에서 상당한 양의 로드를 해제할 수 있습니다.


이 개념 가이드에 따라 프로젝트에 필요할 때만 비용을 추가합니다.

본격적인 마이크로 서비스 아키텍처로의 각 단계는 복잡성을 제거하는 것이 아니라 코드에서 인프라로 복잡성을 이동하므로 부담을 덜 수 있도록 확인하는 것이 좋습니다.


코드, 스크린샷 및 예제가 포함된 전체 자습서를 원하십니까? 어떤 단계에 대해 논의할까요?

댓글로 알려주세요!