🚀 220708: 이슈 처리

### 이슈 처리
* #117 
* #119 
* #120 
* #131 
* #132 
* #138 
* #139 
* #141

content/main/banner.mdx

@@ -2,4 +2,5 @@
 templateKey: main_banner
 title: 마스터즈 코스 2023 대기자 접수 중!
 description: ""
+to: "https://docs.google.com/forms/d/e/1FAIpQLScHRPc7dTFVuMiTeCy7kpp6ks23jtkiiB-qZ3Lv0QtDNPU28w/viewform"
 ---

content/main/interviews.mdx

@@ -10,7 +10,7 @@ interviews:
   - writerPhoto: ""
     nutshell: 누구도 강요하지 않고 엄격한 규칙도 없기에 서로를 향한 존중을 바탕으로 성장할 수 있는 문화를 만들어나가는 것이 중요합니다
     content: 코드스쿼드는 이런 걸 해낼 수 있는 사람들이 모인 집단이기에 저 또한 자율, 책임, 존중 이 세 가지를 실천할 수 있었고, 어떤 개발자가 되어야겠다는 그림을 그릴 수 있었습니다.
-    writer: 재인
+    writer: 제인
     writerInfo: Jane, 네이버 웹툰
 
   - writerPhoto: ""

content/masters/interviewList.mdx

@@ -12,7 +12,7 @@ interviewList:
 - writerPhoto: ""
   nutshell: 누구도 강요하지 않고 엄격한 규칙도 없기에 서로를 향한 존중을 바탕으로 성장할 수 있는 문화를 만들어나가는 것이 중요합니다
   content: 코드스쿼드는 이런 걸 해낼 수 있는 사람들이 모인 집단이기에 저 또한 자율, 책임, 존중 이 세 가지를 실천할 수 있었고, 어떤 개발자가 되어야겠다는 그림을 그릴 수 있었습니다.
-  writer: 재인
+  writer: 제인
   writerInfo: Jane, 네이버 웹툰
 
 - writerPhoto: ""

content/recruit/jobPositionsBackEdu.mdx

@@ -16,7 +16,7 @@ editDate: "2022-04-22"
 
 모든 업무에서는 다른 교육자와 협력하고 서로 배우면서 성장할 수 있습니다.
 
-1. **프론트엔드 커리큘럼 개발**
+1. **백엔드 커리큘럼 개발**
    코드스쿼드는 최고의 교육 콘텐츠를 만듭니다. 실무에 필요한 기초 지식과 최신 기술을 스터디하고, 지식과 응용 기술을 반영한 커리큘럼을 만듭니다.
 
    강의자료를 작성하는 업무는 많지 않습니다. 추구하는 교육 방식은 '미션'과 '프로젝트' 를 해결하기 위해 필요한 지식을 찾는 구성주의 학습입니다. 따라서 학습자가 최고의 경험을 할 수 있도록 '미션'과 '프로젝트' 문제를 설계하고 개발합니다.

gatsby-config.ts

@@ -54,6 +54,12 @@ const config: GatsbyConfig = {
         path: "./content",
       },
     },
+    {
+      resolve: "gatsby-plugin-manifest",
+      options: {
+        icon: "./src/assets/favicon/ms-icon-310x310.png",
+      },
+    },
   ],
 };
 

package.json

@@ -25,6 +25,7 @@
     "gatsby": "^4.13.0",
     "gatsby-plugin-google-analytics": "^4.13.0",
     "gatsby-plugin-image": "^2.13.0",
+    "gatsby-plugin-manifest": "^4.17.0",
     "gatsby-plugin-mdx": "^3.13.0",
     "gatsby-plugin-page-creator": "^4.15.0",
     "gatsby-plugin-react-helmet": "^5.13.0",

src/assets/img/picture/index.ts

@@ -2,13 +2,13 @@ import jk from "./jk.png";
 import crong from "./crong.png";
 import honux from "./honux.png";
 import ivy from "./ivy.png";
-import place1 from "./place1.jpeg";
-import place2 from "./place2.jpeg";
-import place3 from "./place3.jpeg";
-import place4 from "./place4.jpeg";
-import place5 from "./place5.jpeg";
-import place6 from "./place6.jpeg";
-import place7 from "./place7.jpeg";
+import place1 from "./place1.png";
+import place2 from "./place2.png";
+import place3 from "./place3.png";
+import place4 from "./place4.png";
+import place5 from "./place5.png";
+import place6 from "./place6.png";
+import place7 from "./place7.png";
 import howToStudy from "./howtostudy.png";
 
 export default {

src/assets/img/seo/index.ts

@@ -0,0 +1,5 @@
+import codesquad from "./codesquad.png";
+
+export default {
+  codesquad,
+};

src/assets/static/phrases.ts

@@ -15,7 +15,7 @@ const SUBTITLE = {
   CODE_TOGETHER: "코드투게더는",
   CODE_TOGETHER_COURSE: "코드투게더의",
   JAVASCRIPT: "자바스크립트 과정을 경험한",
-  JAVASCRIPT_COURSE: "자바스크립트 코스의",
+  JAVASCRIPT_COURSE: "자바스크립트 과정의",
 };
 
 const TITLE = {

src/assets/static/seo.ts

@@ -0,0 +1,29 @@
+const SEO_TITLE = {
+  MAIN: "코드스쿼드",
+  MASTERS: "마스터즈 코스",
+  CODE_TOGETHER: "코드투게더",
+  FAQ: "자주 묻는 질문",
+  TEAM_CULTURE: "팀 문화",
+  JAVASCRIPT: "자바스크립트",
+  RECRUIT: "채용소식",
+  NOT_FOUND: "존재하지 않는 페이지",
+  REFUND: "환불규정",
+};
+
+const SEO_DESCRIPTION = {
+  MAIN: "스스로 찾은 방법으로 함께 묶은 매듭은 풀리지 않습니다",
+  MASTERS:
+    "마스터즈 코스는 현장처럼 학습하며 분야별 최고의 개발자로 도약하는 데 도움을 주는 풀타임 과정입니다.",
+  CODE_TOGETHER:
+    "코드투게더는 여러 동료들과 ‘함께’ 소프트웨어를 학습하는 코드스쿼드만의 교육 모델입니다. 다양한 분야, 언어, 주제로 소프트웨어를 학습하며 동료와 함께 성장할 수 있습니다.",
+  FAQ: "코드스쿼드에 궁금한 점이 있나요?",
+  TEAM_CULTURE:
+    "우리는 교육자와 학생 그리고 동료들과의 상호작용을 통해 고품질 교육을 경험하는 배움터를 만듭니다",
+  JAVASCRIPT:
+    "자바스크립트와 함께 프로그래밍 기초부터 간단한 웹 애플리케이션 개발까지 경험해보는 코드투게더 과정입니다.",
+  RECRUIT: "지금 코드스쿼드에 지원해 보세요!",
+  NOT_FOUND: "해당 페이지는 존재하지 않습니다.",
+  REFUND: "코드스쿼드 환불규정",
+};
+
+export { SEO_TITLE, SEO_DESCRIPTION };

src/assets/static/urls.ts

@@ -7,6 +7,8 @@ const INTERNAL = {
   REFUND_POLICY: "/refund",
   SUBSCRIPTION: "/subscription",
   TEAM_CULTURE: "/team-culture",
+  JAVASCRIPT: "/code-together/javascript",
+  NOT_FOUND: "/404",
 };
 
 const EXTERNAL = {

src/components/BannerPopup/BannerPopup.tsx

@@ -8,13 +8,14 @@ import icons from "assets/img/icons";
 interface IBannerPopup {
   title: string;
   description: string;
+  to: string;
   onCloseButtonClicked: () => void;
 }
 
-const BannerPopup: React.FC<IBannerPopup> = ({ title, description, onCloseButtonClicked }) => {
+const BannerPopup: React.FC<IBannerPopup> = ({ title, description, to, onCloseButtonClicked }) => {
   return (
     <BannerPopupWrapper>
-      <ContentWrapper>
+      <ContentWrapper href={to} target="_blank" rel="noopener noreferrer nofollow">
         <MBody bold>{title}</MBody>
         {description && <XSBody bold>{description}</XSBody>}
       </ContentWrapper>
@@ -35,13 +36,14 @@ const BannerPopupWrapper = styled.div`
   background-color: ${({ theme: { color } }) => color.greyScale.black};
 `;
 
-const ContentWrapper = styled.div`
+const ContentWrapper = styled.a`
   width: 100%;
   display: flex;
   flex-direction: column;
   justify-content: center;
   align-items: center;
   color: ${({ theme: { color } }) => color.greyScale.white};
+  text-decoration: none;
   & > *:not(:last-child) {
     margin-bottom: 0.4rem;
   }

src/components/HomeGlobalNavigationBar/HomeGlobalNavigationBar.tsx

@@ -1,14 +1,13 @@
 import React from "react";
 import styled from "styled-components";
 import Link from "gatsby-link";
-import { graphql, useStaticQuery } from "gatsby";
 // Assets
 import signiture from "assets/img/illusts/header/signiture";
 import { LINK } from "assets/static/phrases";
 import { INTERNAL } from "assets/static/urls";
 // Libs
 import { useScrollPosition } from "lib/hooks";
-import { getCurrentPath, getDocument, strainMdxInfo } from "lib/utils";
+import { getCurrentPath } from "lib/utils";
 
 const HomeGlobalNavigationBar: React.FC<{ bannerStatus?: boolean }> = ({ bannerStatus }) => {
   const currentPath = getCurrentPath();
@@ -44,13 +43,21 @@ const HomeGlobalNavigationBar: React.FC<{ bannerStatus?: boolean }> = ({ bannerS
           />
         </Link>
         <ButtonList>
-          {links.map(({ title, path }: any) => (
-            <li key={title}>
-              <LinkButton selected={currentPath === path} to={path}>
-                {title}
-              </LinkButton>
-            </li>
-          ))}
+          {links.map(({ title, path }: any) => {
+            const currentFirstPath = currentPath.split("/")[1];
+            const firstPath = path.split("/")[1];
+
+            return (
+              <li key={title}>
+                <LinkButton
+                  selected={currentPath === path || currentFirstPath === firstPath}
+                  to={path}
+                >
+                  {title}
+                </LinkButton>
+              </li>
+            );
+          })}
         </ButtonList>
       </ContentWrapper>
     </HomeGlobalNavigationBarWrapper>

src/lib/context/GlobalHeader.tsx

@@ -1,10 +1,22 @@
 import React from "react";
 import { Helmet } from "react-helmet";
+// Assets
+import seo from "assets/img/seo";
 
-const GlobalHeader: React.FC<{ title?: string }> = ({ title }) => (
+const GlobalHeader: React.FC<{ title: string; description: string; url: string }> = ({
+  title,
+  description,
+  url,
+}) => (
   <Helmet>
-    <title>{title}</title>
     <meta name="viewport" content="width=1440" />
+    <meta property="og:type" content="website" />
+    <meta name="og:image" content={seo["codesquad"]} />
+    <meta name="og:url" content={`https://codesquad.kr${url}`} />
+    <meta name="title" content={title} />
+    <meta name="description" content={description} />
+    <meta name="og:title" content={title} />
+    <meta name="og:description" content={description} />
   </Helmet>
 );
 

src/lib/testUtils/index.ts

@@ -1,3 +1,2 @@
 export { default as TestProvider } from "./TestProvider";
 export { default as removeLineFeed } from "./removeLineFeed";
-export { default as removeCookie } from "./removeCookie";