수색…


소개

nodejs 프로젝트의 구조는 개인적인 선호, 프로젝트의 아키텍처 및 모듈 주입 전략에 의해 영향을받습니다. 또한 동적 모듈 인스턴스화 메커니즘을 사용하는 이벤트 기반 arc '에도 사용됩니다. MVC 구조를 가지려면 클라이언트 측 코드가 최소화되어 브라우저로 전송되고 기본적으로 공개되므로 서버 측과 클라이언트 측 소스 코드를 구분해야합니다. 그리고 서버 측 또는 백엔드는 CRUD 작업을 수행하는 API를 제공합니다.

비고

위의 프로젝트는 응용 프로그램 기본보기 및 축소 라이브러리로 browserify 및 vue.js 모듈을 사용합니다. 따라서 프로젝트 구조는 사용하는 mvc 프레임 워크에 따라 미세하게 변경 될 수 있습니다. 예를 들어 공개 빌드 디렉토리에는 모든 mvc 코드가 포함되어야합니다. 이 작업을 수행 할 수 있습니다.

MVC 및 API가있는 간단한 nodejs 응용 프로그램

  • 첫 번째 주요 차이점은 호스팅에 사용될 동적으로 생성 된 디렉토리와 소스 디렉토리 사이입니다.
  • 소스 디렉토리에는 구성의 양에 따라 구성 파일이나 폴더가 있습니다. 여기에는 내부 구성 디렉토리에 넣을 수있는 환경 구성 및 비즈니스 논리 구성이 포함됩니다.
 |-- Config
        |-- config.json
        |-- appConfig
            |-- pets.config
            |-- payment.config
  • 이제 우리가 서버 측 / 백엔드와 프론트 엔드 모듈을 구별하는 가장 중요한 디렉토리. 2 개의 디렉토리 serverwebapp 는 각각 backend와 frontend를 나타내며, 우리는 소스 디렉토리 즉, 내부에 넣을 수 있습니다. src .

    당신은 당신에게 맞는 것에 따라 서버 또는 웹 애플리케이션을위한 개인적인 선택에 따라 다른 이름을 사용할 수 있습니다. 내부 프로젝트 구조의 끝과 같이 너무 길거나 복잡하게 만들고 싶지 않은지 확인하십시오.

  • 서버 디렉토리 안에 컨트롤러를 가질 수있는 App.js / index.js가 있으며 메인 노드 노드 파일과 시작 지점이 될 것입니다. 서버 디렉토리. 또한 API 컨트롤러가 사용하게 될 모든 데이터 전송 객체를 보유하는 dto dir을 가질 수 있습니다.

     |-- server
          |-- dto
              |-- pet.js
              |-- payment.js
          |-- controller
              |-- PetsController.js
              |-- PaymentController.js
          |-- App.js
    
  • webapp 디렉토리는 publicmvc의 두 가지 주요 부분으로 나눌 수 있습니다. 이것은 다시 빌드 전략을 사용하는 데 영향을받습니다. 우리는 browserfiy 를 사용하여 webapp의 MVC 부분을 빌드하고 mvc 디렉토리의 컨텐츠를 최소화합니다.

    | - webapp | - 공개 | - mvc

  • 이제 공용 디렉토리에는 모든 정적 리소스, 이미지, CSS (saas 파일도 포함될 수 있음) 및 가장 중요한 HTML 파일이 포함될 수 있습니다.

|-- public 
    |-- build  // will contianed minified scripts(mvc)
    |-- images
        |-- mouse.jpg
        |-- cat.jpg
    |-- styles
        |-- style.css
    |-- views
        |-- petStore.html
        |-- paymentGateway.html
        |-- header.html
        |-- footer.html
    |-- index.html
  • mvc 디렉토리에는 모델 , 뷰 컨트롤러 및 UI의 일부로 필요할 수도있는 다른 유틸리티 모듈을 포함하는 프론트 엔드 로직이 포함됩니다. 또한이 디렉토리의 일부인 index.js 또는 shell.js 중에서 선택하십시오.

     |-- mvc
         |-- controllers
             |-- Dashborad.js
             |-- Help.js
             |-- Login.js
         |-- utils
         |-- index.js
    

그래서 결론에 전체 프로젝트 구조는 MVC 스크립트를 축소하세요 공공 디렉토리에 게시합니다 browserify 꿀꺽 같은 below.And 같은 간단한 빌드 작업을 찾을 것입니다. 그런 다음이 공용 디렉토리를 express.use (satic ( 'public')) api를 통해 정적 리소스로 제공 할 수 있습니다.

    |-- node_modules
    |-- src
        |-- server
            |-- controller
            |-- App.js   // node app
        |-- webapp
            |-- public
                |-- styles
                |-- images
                |-- index.html
            |-- mvc
                |-- controller
                |-- shell.js  // mvc shell
    |-- config
    |-- Readme.md
    |-- .gitignore
    |-- package.json


Modified text is an extract of the original Stack Overflow Documentation
아래 라이선스 CC BY-SA 3.0
와 제휴하지 않음 Stack Overflow