외부활동 추가

Author: yurim

src/components/Collapsible.tsx

@@ -2,13 +2,17 @@ import React, { ReactNode, useState } from "react"
 import styled from "styled-components"
 import ChevronDown from "../images/chevron-down.png"
 import ChevronUp from "../images/chevron-up.png"
+import Link from "../images/link.png"
+import { Flex } from "./Flex"
 
 const Collapsible = ({
   title,
   children,
+  link,
 }: {
   title: ReactNode
   children?: ReactNode
+  link?: string
 }) => {
   const [opened, setOpened] = useState(false)
   return (
@@ -22,13 +26,34 @@ const Collapsible = ({
         }}
       >
         {title}
-        {children && (
-          <img
-            style={{ width: 20, height: "fit-content", opacity: 0.3 }}
-            src={opened ? ChevronUp : ChevronDown}
-            alt="chevron"
-          />
-        )}
+        <Flex align="center">
+          {link && (
+            <a href={link} target="_blank">
+              <img
+                style={{
+                  width: 20,
+                  height: "fit-content",
+                  opacity: 0.3,
+                  verticalAlign: "middle",
+                }}
+                src={Link}
+                alt="link"
+              />
+            </a>
+          )}
+          {children && (
+            <img
+              style={{
+                width: 20,
+                height: "fit-content",
+                opacity: 0.3,
+                verticalAlign: "middle",
+              }}
+              src={opened ? ChevronUp : ChevronDown}
+              alt="chevron"
+            />
+          )}
+        </Flex>
       </Title>
       <Contents opened={opened}>
         <Divider />

src/components/CompanyExperience.tsx

@@ -18,7 +18,7 @@ const CompanyExperience = ({
   return (
     <Flex gap={"16px"}>
       <img
-        style={{ width: 40, height: "fit-content", borderRadius: 7 }}
+        style={{ width: 40, height: 40, borderRadius: 7 }}
         src={logoImgSrc}
       ></img>
       <div>

src/images/link.png

@@ -0,0 +1,30 @@
+import { SubHeading2 } from "../../components/SubHeading"
+
+<SubHeading2>Link</SubHeading2>
+
+- 앱: <a href="https://todoy-murex.vercel.app/" target="_blank">https://todoy-murex.vercel.app/</a>
+- 사전신청: <a href="https://forms.gle/KJFZWv9dFtUfAa6p8" target="_blank">https://forms.gle/KJFZWv9dFtUfAa6p8</a>
+
+<SubHeading2>만든 배경</SubHeading2>
+
+- 50개가 넘는 생산성 앱을 써본 후, 나에게
+  맞는 앱을 찾기 어려워 직접 만들었습니다. 현재 저는 메인 투두 앱으로 사용하고
+  있고, 가입자 수는 19명입니다 (회사 내 지인들에게만 공개. 추후 Billing 시스템을
+  갖춘 후 외부 공개 예정)
+
+<SubHeading2>컨셉</SubHeading2>
+
+<u>Goal oriented</u>: 카테고리 대신 목표를 기준으로 태스크를 관리해요. 이로서
+내가 어떤 목표를 달성하기 위해 이 일을 하고 있는지 상기할 수 있어요.
+
+<img src="https://lh5.googleusercontent.com/9_u7QZUQ7J5DtoBuEuP0FYhh8NZDgJDyRrIVnRaZ1GQvAZxcLvGu0xOtpcH_TVAp9Xb1WxcWXg345T7sPW_lbXbMOC9QQIijNzdOaSSUfZYPWpiyq9j-Un8-wej6q0LpUA=w1202" />
+
+<u>High layer view</u>: 한 해 나의 시도와 성취를 한 눈에 볼 수 있는 'Achieved'
+뷰가 있습니다.
+
+<img src="https://lh6.googleusercontent.com/yqEjgDy09eIb8AXaJb4r3BgQN7qKOhKztwgTVdgXa57VlVbOjl-C_T9j8GJTDpFbRbIqVmHEFrSLXGb4_KdGCcEBbYExKC-d3GvjtmWs3WC1knnbnbBocjVXSra81aS9CA=w2740" />
+
+<u>Simplicity</u>: Goals, Focus, Today 3개의 칼럼으로 전체 할일을 관리하는
+프레임입니다. 조만간 할 일은 Focus로, 오늘 당장 할 일은 Today로 마킹합니다.
+
+<img src="https://lh6.googleusercontent.com/yqEjgDy09eIb8AXaJb4r3BgQN7qKOhKztwgTVdgXa57VlVbOjl-C_T9j8GJTDpFbRbIqVmHEFrSLXGb4_KdGCcEBbYExKC-d3GvjtmWs3WC1knnbnbBocjVXSra81aS9CA=w2740" />

src/pages/resume-content/shoot.mdx

@@ -29,6 +29,7 @@ import FLeadContent from "./resume-content/flead.mdx"
 import 퍼블릭스피킹Content from "./resume-content/퍼블릭스피킹.mdx"
 import 장애감소Content from "./resume-content/장애감소.mdx"
 import ZeplContent from "./resume-content/zepl.mdx"
+import ShootContent from "./resume-content/shoot.mdx"
 
 > Product oriented front-end engineer
 
@@ -132,7 +133,7 @@ import ZeplContent from "./resume-content/zepl.mdx"
 <Collapsible title="[Core value] 여러 팀을 넘나들며 조율하는 도메인의 기술적 리드">
   <도메인리드Content />
 </Collapsible>
-<Collapsible title="[Core value] 나만의 F-lead 방식 정립 - 부드러운 리더십을 통한 구성원 발전 및 회사 목표와의 조화">
+<Collapsible title="[Core value] 부드러운 리더십을 통한 구성원 발전 및 회사 목표와의 조화">
   <FLeadContent />
 </Collapsible>
 <Collapsible title="[Core value] 채용 및 브랜딩을 위한 퍼블릭 스피킹에서 가장 먼저 찾는 개발자">
@@ -192,11 +193,38 @@ import ZeplContent from "./resume-content/zepl.mdx"
 
 <SubHeading>2024</SubHeading>
 <Collapsible title="[개인 프로젝트] Shoot: Goal management system">
-  내용입니다
+  <ShootContent />
 </Collapsible>
-
+<Collapsible
+  title="[영상] 모닥불 | EP.1 토스에서 말하는 “가독성 좋은 코드” 란 무엇일까?"
+  link="https://youtu.be/NwLWX2RNVcw?si=8bMgPnayp7Id_Q99"
+/>
+<Collapsible
+  title="[인터뷰] 토스 프론트엔드 챕터 리드는 ‘구성원을 서포팅 하는 사람’이에요!"
+  link="https://toss.im/career/article/toss-frontend-leadership-and-growth"
+/>
+<SubHeading>2023</SubHeading>
+<Collapsible
+  title="[발표] 인프콘 - 팀 플레이어 101"
+  link="https://milooy.github.io/dev/230816-team-player-101/"
+/>
+<Collapsible
+  title="[발표] SLASH 23 - 퍼널: 쏟아지는 페이지 한 방에 관리하기"
+  link="https://youtu.be/NwLWX2RNVcw?si=8bMgPnayp7Id_Q99"
+/>
+<SubHeading>2021</SubHeading>
+<Collapsible
+  title="[발표] SLASH 21 - 실무에서 바로 쓰는 Frontend Clean Code"
+  link="https://youtu.be/edWbHp_k_9Y?si=scrF6aQBahDO73w0"
+/>
+<Collapsible
+  title="[인터뷰] 헤이조이스 인터뷰"
+  link="https://youtu.be/lImj-YpNY8Q?si=20aJMOATcbgz3jhJ"
+/>
 <SubHeading>~2020</SubHeading>
 <Collapsible title="[집필] 팀 개발을 위한 Git & GitHub 시작하기(2020.01.02), 한빛미디어">
+  <p><a href="https://youtu.be/RBgnbNkYpTM?si=IjfMaHWlKuXpQVDz" target="_blank">저자 인터뷰 영상</a></p>
+  <p><a href="https://www.yes24.com/Product/Goods/118827280" target="_blank">도서 소개</a></p>
   <img style={{ width: 150 }} src="https://image.yes24.com/goods/118827280/M" />
 </Collapsible>
 <Collapsible title="[컨퍼런스 개최] Data Science is a Team Sports">
@@ -215,7 +243,9 @@ import ZeplContent from "./resume-content/zepl.mdx"
 
 </Collapsible>
 <Collapsible
-  title="[발표] 삼성전자 키노트, 공개 SW 컨퍼런스 기조 연설 외 Facebook, IBM, 고려대 등 다수 기술 강연" >
+  title="[발표] 삼성전자 SOSCON 기조연설 | 주니어 개발자 5000명, 개발 해서 남 주자" link="https://www.slideshare.net/jayjin0427/soscon-2017-5000-81227938%20" />
+<Collapsible
+  title="[발표] 공개 SW 컨퍼런스 기조 연설 외 Facebook (Seoul, Hanoi), IBM, Microsoft, 고려대, 성신여대, 대덕마이스터고, 한양여대, 원광대 등 다수 기술 강연" >
   <Gallary>
   <img alt="image" src="/assets/resume/hanoi.png" />
   <img alt="image" src="/assets/resume/soscon.png" />