새소식

Study/Next.js

[next.js / typescript] next js 를 typescript로 시작하기/이력서 제출용 개인 홈페이지 만들기 - 1

  • -

깧 먼저 이 프로젝트를 시작하게 된 이유에 대해 간단히 설명해보자면

이력서와 내 포트폴리오들을 한눈에 모아서 보여줄 개인사이트가 필요하다고

계~~~속 생각했지만 시간이 없어서(라는 핑계를 대며) 못했었다.

하지만 지금 프리랜서로 하는 일도 다해서 거의 끝났고, 참여 중이던 해커톤도 잘 마무리 했고,

빡셌던 알고리즘 스터디도 지금 잠시 휴식 상태라서 이때가 아니면 안되겠다 싶었다.

 

가장 익숙한 리액트로 그냥 할까 하다가

이왕이면 Nextjs도 더 익숙해지고 typescript도 더 익숙해지고,,

next js에서 Typescript를 쓰는 프로젝트가 구글링으로 생각보다 많이 안나왔기 때문에...

공부하려면 어쩔 수 없이 내가 공홈보고 정리해놔야겠다.. 라는 생각으로 시작하게 되었다.

 

우선 구현할 기본 기능들은

- 첫 페이지에 내 정보

  --내 사진(대신 캐릭터)

  --contact(번호, 메일, 블로그, 깃허브)

  --내가 사용하는 skills

  --내 성격 등 간단한 소개 

 

- 두 번째 페이지에 내 포트폴리오

  --포트폴리오 배포링크/github 링크

  --각 링크별 홈페이지 사진이 스크롤링 마다 바뀌면서 보여지게

  --해당 포트폴리오에 대한 간단한 혹은 자세한 설명

 

- 세 번째 페이지에서 내 이력, 경력

  --경력 소개

  --받은 교육 소개

  --자격증(?) 소개

 

이렇게 생각하고 있다.

원래는 pdf와 디자인을 동일하게 해서 날로 먹을 생각이었지만

페이지 당 들어갈 사이즈가 a4와 pc화면이 너무 다르기도 하고

이왕하는거 당연히 반응형이어야 되지 않겠나 해서 

그러려면 무조건 웹용과 pdf문서용이 다르게 디자인 되어야 할테니...

일을 좀 많이 키운 느낌이지만 어쩄든 그렇게 하기로 한다....

이왕 만드는 내 소개 페이지 멋있고 예쁘게 (코드도 예쁘게) 만들면 좋지 않겠나,,

왜케 할아부지 말투같지

쩄든 사용할 기술은 

 

- next.js

- typescript

- mui

- 스크롤모션을 넣을 프레임워크(framer motion?이런 것처럼)

 

이 정도로 생각하고 있다.

나중에는 내가 qrcode를 찍고 로그인하면 내 정보 수정할 수 있게(사람들 하게 보여지는 페이지와 다르게)

요렇게 생각하고 있긴한데 우선 그건 나중으로....

지금은 빨리 만들고 빨리 이력서 넣어서 직장인 되고 싶다아아ㅏ

프리랜서도 좋지만 이제 회사밥을 먹고 싶다구우우 흡

 

여기까지 서론

다음글에 본론을 시작해야겠다..

Contents

포스팅 주소를 복사했습니다.

이 글이 도움이 되었다면 공감 부탁드립니다.