diff --git a/README.md b/README.md index d517a18ea..3bfa5d8a9 100644 --- a/README.md +++ b/README.md @@ -1,54 +1,19 @@

- - Gatsby + +

-

- Gatsby minimal TypeScript starter -

-## πŸš€ Quick start +

+ μ½”λ“œμŠ€μΏΌλ“œ ν™ˆνŽ˜μ΄μ§€ +

-1. **Create a Gatsby site.** +자유둭게 νƒν—˜ν•˜λ©° ν•¨κ»˜ μ„±μž₯ν•˜λŠ” λ™λ£Œλ₯Ό λ§Œλ‚  수 μžˆλŠ” μ½”λ“œμŠ€μΏΌλ“œ μž…λ‹ˆλ‹€. - Use the Gatsby CLI to create a new site, specifying the minimal TypeScript starter. +

+ μœ μ§€λ³΄μˆ˜ κ΄€λ ¨ μŠ€ν† λ¦¬λΆ μ£Όμ†Œ +

- ```shell - # create a new Gatsby site using the minimal TypeScript starter - npm init gatsby - ``` +- https://627a29cdb418b5004a1d4cb8-bliqdwctlk.chromatic.com/?path=/story/home-introduction--page -2. **Start developing.** - - Navigate into your new site’s directory and start it up. - - ```shell - cd my-gatsby-site/ - npm run develop - ``` - -3. **Open the code and start customizing!** - - Your site is now running at http://localhost:8000! - - Edit `src/pages/index.tsx` to see your site update in real-time! - -4. **Learn more** - - - [Documentation](https://www.gatsbyjs.com/docs/?utm_source=starter&utm_medium=readme&utm_campaign=minimal-starter-ts) - - - [Tutorials](https://www.gatsbyjs.com/tutorial/?utm_source=starter&utm_medium=readme&utm_campaign=minimal-starter-ts) - - - [Guides](https://www.gatsbyjs.com/tutorial/?utm_source=starter&utm_medium=readme&utm_campaign=minimal-starter-ts) - - - [API Reference](https://www.gatsbyjs.com/docs/api-reference/?utm_source=starter&utm_medium=readme&utm_campaign=minimal-starter-ts) - - - [Plugin Library](https://www.gatsbyjs.com/plugins?utm_source=starter&utm_medium=readme&utm_campaign=minimal-starter-ts) - - - [Cheat Sheet](https://www.gatsbyjs.com/docs/cheat-sheet/?utm_source=starter&utm_medium=readme&utm_campaign=minimal-starter-ts) - -## πŸš€ Quick start (Gatsby Cloud) - -Deploy this starter with one click on [Gatsby Cloud](https://www.gatsbyjs.com/cloud/): - -[Deploy to Gatsby Cloud](https://www.gatsbyjs.com/dashboard/deploynow?url=https://github.com/gatsbyjs/gatsby-starter-minimal-ts) +ν•΄λ‹Ή νŽ˜μ΄μ§€λŠ” [Gatsby minimal TypeScript Starter](https://github.com/gatsbyjs/gatsby-starter-minimal-ts) λ₯Ό 톡해 λ§Œλ“€μ–΄μ‘ŒμŠ΅λ‹ˆλ‹€. diff --git a/content/main/masters.mdx b/content/main/masters.mdx index 5dd65891e..619780a9a 100644 --- a/content/main/masters.mdx +++ b/content/main/masters.mdx @@ -42,24 +42,6 @@ masters: image: smallMastersCourse path: /masters - - image: ivy - field: λͺ¨λ°”일 μ•ˆλ“œλ‘œμ΄λ“œ - name: 아이비 - introduce: Ivy, λͺ¨λ°”일 μ•ˆλ“œλ‘œμ΄λ“œ λ§ˆμŠ€ν„° - nutshell: "β€œκ°€μΉ˜ μžˆλŠ” 무언가λ₯Ό λ§Œλ“œλŠ” 과정을 즐길 수 μžˆλ‹€λ©΄, 직접 λΆ€λ”ͺν˜€μ„œ ν™•μΈν•΄λ³΄μ„Έμš”!”" - careers: - - μ›λ°€λ¦¬μ–ΈλΌμΈμ¦ˆμ½”λ”© CEO - - μš°μ•„ν•œν…Œν¬μΊ ν”„ μ•ˆλ“œλ‘œμ΄λ“œ ꡐ윑 - - 넀이버 λΆ€μŠ€νŠΈμΊ ν”„ μ•ˆλ“œλ‘œμ΄λ“œ ꡐ윑 - - μ›ν‹°λ“œ ν”„λ¦¬μ˜¨λ³΄λ”© μ•ˆλ“œλ‘œμ΄λ“œ μ½”μŠ€ - - Udemy μ•ˆλ“œλ‘œμ΄λ“œ μ•±κ°œλ°œ λΆ€νŠΈμΊ ν”„ - - μ „ μΉ΄μΉ΄μ˜€νŽ˜μ΄μ§€ μ•ˆλ“œλ‘œμ΄λ“œ 개발자 - schedules: - - title: λ§ˆμŠ€ν„°μ¦ˆ - subtitle: λͺ¨λ°”일 μ•ˆλ“œλ‘œμ΄λ“œ 클래슀 - image: smallMastersCourse - path: /masters - - image: jk field: λͺ¨λ°”일 iOS name: JK diff --git a/content/masters/curriculum_android.mdx b/content/masters/curriculum_android.mdx deleted file mode 100644 index 0ea998fe2..000000000 --- a/content/masters/curriculum_android.mdx +++ /dev/null @@ -1,32 +0,0 @@ ---- -templateKey: masters_curriculum_android -index: 3 -tabName: "λͺ¨λ°”일 μ•ˆλ“œλ‘œμ΄λ“œ" -curriculum: - - subject: 개인 및 κ·Έλ£Ή ν”„λ‘œμ νŠΈ - subjectList: - - name: 사진 μ•‘μž μ•± - detail: Material Design, User Interface, Activity - - - name: 포컀 κ²Œμž„ μ•± - detail: Activity, Fragment, Navigation - - - name: λ“œλ‘œμž‰ μ•± - detail: ν”„λ‘œμ νŠΈ ꡬ쑰, MVP νŒ¨ν„΄, 객체지ν–₯ ν”„λ‘œκ·Έλž˜λ°, Observer νŒ¨ν„΄, μ»€μŠ€ν…€ λ·°, κΆŒν•œ - - - name: ν•  일 관리 μ•± - detail: λ„€νŠΈμ›Œν¬ ν”„λ‘œκ·Έλž˜λ°, Kotlin Coroutine - - - name: 사진 관리 μ•± - detail: MVVM νŒ¨ν„΄, RecyclerView - - - name: 이슈 관리 μ•± - detail: Jetpack Compose, Broadcast, Notification - -masterInfoList: - - picture: ivy - name: 아이비 - position: Ivy, λͺ¨λ°”일 μ•ˆλ“œλ‘œμ΄λ“œ λ§ˆμŠ€ν„° - nutshell: "μ•ˆλ“œλ‘œμ΄λ“œ μ•± κ°œλ°œμ„ μ—¬λŸ¬κ°€μ§€ λ―Έμ…˜κ³Ό ν”„λ‘œμ νŠΈμ™€ ν•¨κ»˜ μ‹œμž‘ν•΄λ³΄μ•„μš”! ”" - introduce: λ§ˆμŠ€ν„°μ˜ ν”Όλ“œλ°±κ³Ό ν˜‘μ—… κ²½ν—˜μ„ ν•¨κ»˜ 얻을 수 μžˆμŠ΅λ‹ˆλ‹€. ---- diff --git a/src/assets/img/picture/dangle.png b/src/assets/img/picture/dangle.png new file mode 100644 index 000000000..f9e36816f Binary files /dev/null and b/src/assets/img/picture/dangle.png differ diff --git a/src/assets/img/picture/index.ts b/src/assets/img/picture/index.ts index a25395dbf..fa1a9d3a0 100644 --- a/src/assets/img/picture/index.ts +++ b/src/assets/img/picture/index.ts @@ -1,5 +1,6 @@ import jk from "./jk.png"; import crong from "./crong.png"; +import dangle from "./dangle.png"; import honux from "./honux.png"; import ivy from "./ivy.png"; import silver from "./silver.png"; @@ -16,6 +17,7 @@ import howToStudy from "./howtostudy.png"; export default { jk, crong, + dangle, honux, ivy, silver, diff --git a/src/components/Registration/Registration.tsx b/src/components/Registration/Registration.tsx index 5c22beb3d..4a0d7890f 100644 --- a/src/components/Registration/Registration.tsx +++ b/src/components/Registration/Registration.tsx @@ -17,6 +17,8 @@ const Registration: React.FC<{ registrations: RegistrationType[] }> = ({ registr const RegistrationWrapper = styled.div` display: flex; + flex-direction: column; + gap: 1.2rem; @media ${({ theme }) => theme.device.mobile} { padding: 0 2.4rem; padding-top: 8rem; diff --git a/src/pageComponents/code-together/Course/Course.tsx b/src/pageComponents/code-together/Course/Course.tsx index ba50230ac..36d108320 100644 --- a/src/pageComponents/code-together/Course/Course.tsx +++ b/src/pageComponents/code-together/Course/Course.tsx @@ -76,14 +76,19 @@ const TitleWrapper = styled.div` const CourseListWrapper = styled.div` width: 100%; - margin-top: 4rem; - padding: 8rem 0 16rem 0; - background-color: ${({ theme: { color } }) => color.surface.offWhite1}; + @media ${({ theme }) => theme.device.mobile} { + padding: 4.8rem 0 5.6rem 0; + } + @media ${({ theme }) => theme.device.tablet} { + padding: 4.8rem 0 13.6rem 0; + } + @media ${({ theme }) => theme.device.desktop} { + padding: 8rem 0 16rem 0; + } `; const CourseList = styled.ul` margin: 0 auto 6.4rem auto; - background-color: ${({ theme: { color } }) => color.surface.offWhite1}; display: flex; flex-flow: row wrap; & > *:nth-child(2n - 1) { @@ -95,13 +100,14 @@ const CourseList = styled.ul` @media ${({ theme }) => theme.device.mobile} { flex-direction: column; margin-bottom: 3.2rem; + padding: 0 2.4rem; & > *:not(:last-child) { margin-bottom: 2.4rem; } } @media ${({ theme }) => theme.device.tablet} { flex-direction: column; - padding: 8rem; + padding: 0 8rem; & > *:not(:last-child) { margin-bottom: 3.2rem; } diff --git a/src/pageComponents/code-together/CourseList/CourseList.tsx b/src/pageComponents/code-together/CourseList/CourseList.tsx index 457a76115..edd785640 100644 --- a/src/pageComponents/code-together/CourseList/CourseList.tsx +++ b/src/pageComponents/code-together/CourseList/CourseList.tsx @@ -58,15 +58,9 @@ const CourseWrapper = styled.ul` const CourseListWrapper = styled.ul` display: flex; + flex-direction: column; justify-content: center; - & > *:not(:last-child) { - margin-right: 2.4rem; - } - @media ${({ theme }) => theme.device.mobile} { - & > *:not(:last-child) { - margin-right: 1.6rem; - } - } + gap: 1.2rem; `; const CodeTogetherCourseListQuery = graphql` diff --git a/src/pageComponents/code-together/Feature/Feature.tsx b/src/pageComponents/code-together/Feature/Feature.tsx index 3adda9d3d..6bd8fbc2a 100644 --- a/src/pageComponents/code-together/Feature/Feature.tsx +++ b/src/pageComponents/code-together/Feature/Feature.tsx @@ -31,7 +31,7 @@ const Feature: React.FC = ({}) => { const FeatureWrapper = styled.div` margin: 0 auto; - margin-top: 8rem; + margin-bottom: 18rem; @media ${({ theme }) => theme.device.mobile} { padding: 0 2.4rem; } diff --git a/src/pageComponents/code-together/StudyFeature/StudyFeature.tsx b/src/pageComponents/code-together/StudyFeature/StudyFeature.tsx index ab8c208e5..9e9f0aa02 100644 --- a/src/pageComponents/code-together/StudyFeature/StudyFeature.tsx +++ b/src/pageComponents/code-together/StudyFeature/StudyFeature.tsx @@ -19,37 +19,45 @@ const StudyFeature: React.FC = () => { const { isDesktop, isMobile } = useResponsive(); return ( - - - - {studyFeatures.map(({ title, descriptions, img }) => ( - - - - ))} - - + + + + + {studyFeatures.map(({ title, descriptions, img }) => ( + + + + ))} + + + ); }; -const StudyWrapper = styled.div` - padding-top: 18rem; +const StudyBackgroundWrapper = styled.div` + width: 100%; + background-color: ${({ theme: { color } }) => color.surface.offWhite1}; + @media ${({ theme }) => theme.device.mobile} { + background-color: ${({ theme: { color } }) => color.surface.white20}; + } +`; + +const StudyWrapper = styled.div<{ backgroundColor?: string }>` margin: 0 auto; - margin-top: 8rem; @media ${({ theme }) => theme.device.mobile} { padding: 0 2.4rem; } @media ${({ theme }) => theme.device.tablet} { - padding: 0 8rem; + padding: 8rem 8rem; } @media ${({ theme }) => theme.device.desktop} { width: 106.2rem; - padding: 0 18.9rem; + padding: 8rem 18.9rem; } `; diff --git a/src/pageComponents/main/Master/Master.tsx b/src/pageComponents/main/Master/Master.tsx index 18b9c189c..53c7baa48 100644 --- a/src/pageComponents/main/Master/Master.tsx +++ b/src/pageComponents/main/Master/Master.tsx @@ -2,7 +2,7 @@ import React from "react"; import styled, { useTheme } from "styled-components"; import { graphql, Link, useStaticQuery } from "gatsby"; // Type -import { MasterType } from "@type/Master"; +import type { MasterType } from "@type/Master"; // Typography import { Typography } from "typography"; // Components @@ -29,6 +29,12 @@ const Master: React.FC = () => { setMasterIntroduce(masters[index]); }; + const dangleCareers: MasterType["careers"] = [ + "μ „ Amazon Web Services Technical Trainer", + "μ „ 카카였 Backend engineer", + "μ „ NHN NEXT UI/Web programming 전곡 μ‘Έμ—…", + ]; + return ( @@ -103,6 +109,47 @@ const Master: React.FC = () => { )} + + {/* ν•˜λ“œμ½”λ”© */} + {masterIntroduce.name === "ν˜Έλˆ…μŠ€" && ( + + + + + + Dangle + + + λ‹ΉκΈ€, μ›Ή λ°±μ—”λ“œ λ§ˆμŠ€ν„° + + + + + + β€œκ°œλ°œμ— 정닡은 μ—†λ‹€κ³  μƒκ°ν•©λ‹ˆλ‹€. ν˜„μž¬ μƒν™©μ—μ„œ μ΅œμ„ μ˜ 닡을 찾을 뿐." + + + + {dangleCareers?.map((career) => ( +
  • + + {career} + +
    • + ))} +     +     +     +     + /* ν•˜λ“œμ½”λ”© */ + )}     );