[JQUERY] 가장 좋은 방법은 자바 스크립트 라이브러리 및 CSS 폴더 구조를 구성하기 [마감]

가장 좋은 방법은 자바 스크립트 라이브러리 및 CSS 폴더 구조를 구성하기 [마감]

해결법

1. ---

   1.나는 당신의 HTML5 응용 프로그램에서 파일을 구성하기 위해 권장되는 구조를 개설 할 것이다. 이 표준의 모든 종류를 만들 수있는 시도하지 않습니다. 대신, 논리적 편리한 방법으로 그룹 이름과 파일에 대한 방법에 대한 제안을 할 것입니다. 귀하의 프로젝트하자의 당신은 HTML5 응용 프로그램을 작성한다고 가정합니다. 경우에 따라 주요 컨테이너로 서버의 루트를 사용할 수 있지만이 문서의 목적을 위해 당신이 HTML5 응용 프로그램 폴더에 포함되어 가정합니다. 이 폴더 안에 당신은 당신의 응용 프로그램 인덱스 파일 또는 주 진입 점을 만들어야합니다. 내-index.html을 일반적으로 appcropolis 프로젝트, 응용 프로그램은 HTML, CSS, 이미지, 자바 스크립트 파일로 구성됩니다. 이러한 파일 중 일부는 응용 프로그램에 특정되며 일부 다른 여러 응용 프로그램에서 사용할 수 있습니다. 이것은 매우 중요한 차이점이다. 당신은 응용 프로그램 별 자원에서 범용 파일을 분리하여 시작해야합니다 파일의 효과적인 그룹화를 수행합니다. appcropolis 프로젝트 자원 내-index.html을이 간단한 분리가 훨씬 쉽게 파일을 탐색합니다 공급 업체. 당신이 편집 될 파일은 자원 폴더에 위치하게 될 것이 분명하다 폴더 당신은 공급 업체의 내부 라이브러리와 범용 파일을 배치하면. 이외에도 HTML 코드에서 응용 프로그램에있는 파일의 나머지 부분은 대부분 CSS, 자바 스크립트 및 이미지입니다. 기회는 폴더 내부에 이미 그룹 응용 프로그램 파일이 그 자산이 종류에 해당합니다. appcropolis 프로젝트 자원 CSS JS 이미지 데이터는 자바 스크립트 코드를 개최한다 폴더 내-index.html을 JS 벤더. 마찬가지로, 이미지 폴더는 애플리케이션의 index.html을 또는 다른 페이지에서 직접 사용되는 이미지를 추가해야하는 곳입니다. 호스트 스타일 시트 관련 파일을 사용할 수 없습니다 폴더이 이미지. 귀하의 CSS 코드 및 관련 이미지는 CSS를 폴더 안에 위치해야합니다. 이렇게함으로써, 당신은 쉽게 다른 테마를 사용할 수있는 페이지를 구축 할 수 있습니다 당신은 당신의 응용 프로그램이 더 이식 할 수 있습니다. appcropolis 프로젝트 자원은 CSS 블루 테마 background.png 이미지 background.png 블루 theme.css 내-index.css JS 내-하는 index.js 내-접촉 info.js 이미지 제품 computer.jpg cellphone.png printer.jpg 내 - 회사 로고-small.png 내-회사 로고 large.png 데이터를 일부-data.json 더-인 data.xml 테이블 data.csv 여분 data.txt로 업체 JQuery와 이미지 아이콘-18-loader.gif 아약스 white.png jquery.min.js jquery.mobile - 1.1.0.min.css의 jquery.mobile-1.1.0.min.js 일부-CSS-라이브러리는 일부-plugin.jquery 내-index.html을 내-접촉 정보 - 내를 products.html, .html 파일 앞의 예를 보여줍니다에게 CSS 폴더의 내용을. 공지 사항 메인 CSS 파일 표기라는 이름의 파일 default.css가 있음. 기본 스타일 시트에서 사용하는 이미지는 이미지 폴더 안에 위치해야한다. 당신은 다른 스타일을 만들거나 기본 스타일 시트에 정의 된 규칙을 무시하고자하는 경우, 추가 CSS 파일과 기자 폴더를 생성 할 수 있습니다. 예를 들어, 블루 theme.css 스타일 시트를 만들 수 있으며, 블루 테마 폴더 안에 모든 관련 이미지를 배치합니다. (이 경우 내-된 index.html)에 CSS 또는 하나의 페이지에서 사용하는 자바 스크립트 코드가있는 경우, 당신은 할 수 그룹 페이지의 특정 코드 내부의 .CSS하고 페이지의 같은 이름의 .js 파일을 (EI 내 인덱스 .CSS 내-하는 index.js). 귀하의 CSS와 자바 스크립트 코드는 가능한 일반해야하지만 당신은 별도의 파일에 배치하여 예외를 추적 할 수 있습니다. 일부 최종 권고가 최종 권고는 폴더와 파일 이름을 주위에 만들 수 있습니다. 일반적으로 모든 폴더와 파일 이름에 소문자를 사용해야합니다. 파일 이름을 여러 단어를 사용하거나 폴더는 하이픈으로 구분하는 경우 (즉, 내-회사 로고 small.png). 이 문서의 조언을 따른다면 당신은 잘 분리 일반적인 함께 자원과 사용자 지정 코드를 유지하면서 여러 페이지를 결합 할 수 있어야한다. 마지막으로,이 문서에서 권장하는 구조를 사용하도록 선택하지 않는 경우에도, 규칙에 충실하는 것이 중요하다. 그것은 당신의 생산성을 향상하고 더 중요한 그것은 당신이 다른 사람이 이해하기 쉽게 할 수있는 일을 할 것입니다.

   나는 당신의 HTML5 응용 프로그램에서 파일을 구성하기 위해 권장되는 구조를 개설 할 것이다. 이 표준의 모든 종류를 만들 수있는 시도하지 않습니다. 대신, 논리적 편리한 방법으로 그룹 이름과 파일에 대한 방법에 대한 제안을 할 것입니다. 귀하의 프로젝트하자의 당신은 HTML5 응용 프로그램을 작성한다고 가정합니다. 경우에 따라 주요 컨테이너로 서버의 루트를 사용할 수 있지만이 문서의 목적을 위해 당신이 HTML5 응용 프로그램 폴더에 포함되어 가정합니다. 이 폴더 안에 당신은 당신의 응용 프로그램 인덱스 파일 또는 주 진입 점을 만들어야합니다. 내-index.html을 일반적으로 appcropolis 프로젝트, 응용 프로그램은 HTML, CSS, 이미지, 자바 스크립트 파일로 구성됩니다. 이러한 파일 중 일부는 응용 프로그램에 특정되며 일부 다른 여러 응용 프로그램에서 사용할 수 있습니다. 이것은 매우 중요한 차이점이다. 당신은 응용 프로그램 별 자원에서 범용 파일을 분리하여 시작해야합니다 파일의 효과적인 그룹화를 수행합니다. appcropolis 프로젝트 자원 내-index.html을이 간단한 분리가 훨씬 쉽게 파일을 탐색합니다 공급 업체. 당신이 편집 될 파일은 자원 폴더에 위치하게 될 것이 분명하다 폴더 당신은 공급 업체의 내부 라이브러리와 범용 파일을 배치하면. 이외에도 HTML 코드에서 응용 프로그램에있는 파일의 나머지 부분은 대부분 CSS, 자바 스크립트 및 이미지입니다. 기회는 폴더 내부에 이미 그룹 응용 프로그램 파일이 그 자산이 종류에 해당합니다. appcropolis 프로젝트 자원 CSS JS 이미지 데이터는 자바 스크립트 코드를 개최한다 폴더 내-index.html을 JS 벤더. 마찬가지로, 이미지 폴더는 애플리케이션의 index.html을 또는 다른 페이지에서 직접 사용되는 이미지를 추가해야하는 곳입니다. 호스트 스타일 시트 관련 파일을 사용할 수 없습니다 폴더이 이미지. 귀하의 CSS 코드 및 관련 이미지는 CSS를 폴더 안에 위치해야합니다. 이렇게함으로써, 당신은 쉽게 다른 테마를 사용할 수있는 페이지를 구축 할 수 있습니다 당신은 당신의 응용 프로그램이 더 이식 할 수 있습니다. appcropolis 프로젝트 자원은 CSS 블루 테마 background.png 이미지 background.png 블루 theme.css 내-index.css JS 내-하는 index.js 내-접촉 info.js 이미지 제품 computer.jpg cellphone.png printer.jpg 내 - 회사 로고-small.png 내-회사 로고 large.png 데이터를 일부-data.json 더-인 data.xml 테이블 data.csv 여분 data.txt로 업체 JQuery와 이미지 아이콘-18-loader.gif 아약스 white.png jquery.min.js jquery.mobile - 1.1.0.min.css의 jquery.mobile-1.1.0.min.js 일부-CSS-라이브러리는 일부-plugin.jquery 내-index.html을 내-접촉 정보 - 내를 products.html, .html 파일 앞의 예를 보여줍니다에게 CSS 폴더의 내용을. 공지 사항 메인 CSS 파일 표기라는 이름의 파일 default.css가 있음. 기본 스타일 시트에서 사용하는 이미지는 이미지 폴더 안에 위치해야한다. 당신은 다른 스타일을 만들거나 기본 스타일 시트에 정의 된 규칙을 무시하고자하는 경우, 추가 CSS 파일과 기자 폴더를 생성 할 수 있습니다. 예를 들어, 블루 theme.css 스타일 시트를 만들 수 있으며, 블루 테마 폴더 안에 모든 관련 이미지를 배치합니다. (이 경우 내-된 index.html)에 CSS 또는 하나의 페이지에서 사용하는 자바 스크립트 코드가있는 경우, 당신은 할 수 그룹 페이지의 특정 코드 내부의 .CSS하고 페이지의 같은 이름의 .js 파일을 (EI 내 인덱스 .CSS 내-하는 index.js). 귀하의 CSS와 자바 스크립트 코드는 가능한 일반해야하지만 당신은 별도의 파일에 배치하여 예외를 추적 할 수 있습니다. 일부 최종 권고가 최종 권고는 폴더와 파일 이름을 주위에 만들 수 있습니다. 일반적으로 모든 폴더와 파일 이름에 소문자를 사용해야합니다. 파일 이름을 여러 단어를 사용하거나 폴더는 하이픈으로 구분하는 경우 (즉, 내-회사 로고 small.png). 이 문서의 조언을 따른다면 당신은 잘 분리 일반적인 함께 자원과 사용자 지정 코드를 유지하면서 여러 페이지를 결합 할 수 있어야한다. 마지막으로,이 문서에서 권장하는 구조를 사용하도록 선택하지 않는 경우에도, 규칙에 충실하는 것이 중요하다. 그것은 당신의 생산성을 향상하고 더 중요한 그것은 당신이 다른 사람이 이해하기 쉽게 할 수있는 일을 할 것입니다.

   자료 제공 : 당신의 HTML, CSS, 자바 스크립트 파일을 구성하는 방법

2. ---

   2.

    root/
      assets/
         lib/-------------------------libraries--------------------
             bootstrap/--------------Libraries can have js/css/images------------
                 css/
                 js/
                 images/  
             jquery/
                 js/
             font-awesome/
                 css/
                 images/
        common/--------------------common section will have application level resources             
             css/
             js/
             img/
   
    index.html
   

   이것은 내가 내 응용 프로그램의 정적 리소스를 조직하는 방법입니다.

from https://stackoverflow.com/questions/24199004/best-practice-to-organize-javascript-library-css-folder-structure by cc-by-sa and MIT license