Jeonggon Gatsby Dev Blog

  Gatsby     

• 1 : 2024.04.27 ~ 2024.05.12

2. Markdown HTML
6. TOC(Table Of Content)
7. giscus

• Gatsby React JAM(JS, APIs, Markup) stack , GraphQL
  .

•   , SEO     .
  

• , .

• Gatsby GraphQL .
• GraphiQL .

•       ,        .
  

• JavaScript .
• TypeScript , .

• JavaScript  TypeScript     .
  

• JavaScript . (CSS-in-JS)
• Styled Component CSS .

•      .
  

• Netlify Gatsby JAM stack , .
• GitHub .
• CDN(Content Delivery Network) .
• .

 src
  
    components
    
      Blog
      
        Category
         CategoryItem.tsx
         CategoryList.tsx
      
        Post
         PostCard.tsx
         PostCards.tsx
         PostComments.tsx
         PostContent.tsx
         PostHeader.tsx
         PostList.tsx
         PostMobileToc.tsx
         PostPagination.tsx
         PostPrevNextBtn.tsx
         PostPrevNextBtns.tsx
         PostProfile.tsx
         PostSameCategory.tsx
         PostTag.tsx
         PostTags.tsx
         PostToc.tsx
      
       Tab.tsx
       Tabs.tsx
       Tag.tsx
       TagMenu.tsx
    
      Common
       Footer.tsx
       Header.tsx
       Search.tsx
       TopBtn.tsx
    
      Index
        CarouselItem.tsx
        CarouselItems.tsx
        Profile.tsx
  
    hooks
     usePagination.ts
  
    pages
     404.tsx
     about.tsx
     categories.tsx
     category.tsx
     index.tsx
     posts.tsx
     projects.tsx
  
    styles
     GlobalStyle.tsx
     theme.style.ts
  
    templates
     BlogTemplate.tsx
     PostTemplate.tsx
     Template.tsx
  
   emotion.d.ts

URL

1.

2.

3.

4.

5.

6.

7.

8. 404

1. Theme

2.

3. (, )

4.

5. top

6. GraphQL

7. URL

8. Slug

9. Markdown HTML

10. Meta

11. favicon

12.

13. display: none visibility: hidden

14. TOC (Table Of Contents)

15. (Pagination)

16. , window

17.

1. Keep

2. Problem

3. Try