Gatsby: [1.0] 프로젝트 시작 - 솔루션 구조

안녕하세요 팀 개츠비입니다.

탐색을 시작하기 위해 실행하지 않고 다음 프로젝트를 설정했습니다. 지금까지는 그 뼈대를 나타냅니다. 질문은 내 VSCode의 다음 스크린샷에 넣은 폴더 구조에 대한 것입니다.

1. 데이터가 사전 컴파일 단계로 contentful에서 내 콘텐츠를 다운로드할 수 있는 디렉토리인지 확인하십시오.
   
   
   
   • 내 아이디어는 자주 변경되지 않는 CMS/DMS에서 JSON 및 이미지의 텍스트 콘텐츠를 다운로드하는 것입니다. 예를 들어 기사, 상품 상세 페이지 등,
   
   
2. 사이트의 다른 섹션에 대해 여러 개의 개별 폴더에 데이터를 다운로드하지만 확인하기 위해 이러한 데이터 소스를 다음과 같이 사용할 수 있습니다.
   
3. gatsbygram 예제의 루트에 있는 Utils는 컴파일 시간에 Node에서 호출할 수 있는 JavaScript 유틸리티를 넣을 수 있는 폴더입니다.
4. 구성 요소를 정의할 때, 예를 들어 React BootStrap 구성 요소를 사용하거나 원자 설계 원칙을 따르기 위해 자체 원자 구성 요소를 만드는 것을 권장합니까?
5. 필요한 경우 다른 공개 구성 요소와 함께 위의 원자 구성 요소를 사용하여 복합 구성 요소를 만드는 것이 좋은 생각입니까?
6. 이름 자체에서 알 수 있듯이 default.js는 레이아웃이지만 실제로는 html.js에서도 전체 HTML 구조를 정의할 수 있습니다. 그래서 레이아웃 폴더가 필요한 이유가 무엇입니까?
7. 페이지 디렉토리는 여기에서 파일을 빌드 시 직접 HTML 페이지로 변환합니다. 하지만 더 궁금한 점이 있습니다.
   NS. 위 스크린샷에서 tips-and-articles.js는 html 페이지로 변환됩니다. 하지만 www.abc.com/en-us/tips-and-articles/how-to-do-this 와 같은 URL 구조를 더 자세히 할까요 ?
   NS. 비즈니스 작성자가 CMS에서 페이지 자체를 정의할 수 있는 CMS를 사용하여 전체 IA(정보 아키텍처 또는 웹 사이트 페이지 계층)를 생성하려면 어떻게 합니까?
   씨. 페이지가 현재 www.abc.com/fr-fr/Conseils-et-articles/how-to-do-ce에 있는 이 페이지를 내일 현지화하려면 어떻게 합니까
8. Gatsbygram 예에서 모달 대화 상자에 Instagram 게시물을 표시합니다. SEO 및 더 나은 추적 목적을 위해 각 개별 페이지로 게시물을 표시하려면 어떻게 해야 할까요? 템플릿을 사용하여 해당 페이지를 생성하는 방법은 무엇입니까?
9. 키 값 쌍 또는 CSS 선언을 유지 관리하는 것 외에 SRC에서 utils 폴더를 사용하는 것은 무엇입니까?
10. 모든 경우에 인라인 CSS를 사용했고 중요한 CSS에 유용하다는 것을 알고 있지만 PostCSS 또는 SaSS 모델을 사용하는 구성 요소에서 일반적인 클래스 기반 CSS 구현을 볼 수 없습니다.
11. 귀하의 scrape.js에서 영감을 받아 Contentful에서 콘텐츠를 생성 및 다운로드하는 데 사용됩니다.
12. 누군가 위 스크린샷의 12번 항목에서 강조 표시된 각 파일을 자세히 설명하면 좋을 것입니다.