순열과 조합... 중고등학교 때부터 학부까지 그렇게 많이 그 공식을 써왔는데... 이젠 공식조차 기억이 안난다. 그리고 순열과 조합의 각 케이스를 프로그래밍적으로 구하는 건 더더욱 해본적이 없다. 이번에 정리해두고 헷갈릴 때마다 꺼내 쓰자. 개념 순열 (Permutation) 서로 다른 n개 중 r개를 순서에 상관있게 선택하는 경우의 수이다. {1, 2, 3} 중 2개 원소를 선택한다고 하면, {1, 2}, {1, 3}, {2, 1}, {2, 3}, {3, 1}, {3, 2}의 6가지 경우가 나온다. 공식으로 경우의 수만 구하자면, 아래와 같다. 배열 (Combination) 서로 다른 n개 중 r개를 순서에 상관 없이 선택하는 경우의 수이다. {1, 2, 3}중 2개의 원소를 선택한다면, {1, 2},..
Intro 구현할 때 뒤로 밀어두었던 타이핑 효과를 추가하였다. # 계획 1. 오픈 소스 이용 1.1 react-type-animation 가장 먼저 고려하였던건 'react-type-animation'이다. https://www.npmjs.com/package/react-type-animation react-type-animation Customizable React typing animation component based on typical.. Latest version: 3.1.0, last published: 2 months ago. Start using react-type-animation in your project by running `npm i react-type-animation`. T..
# 계획 이랄게 없다. Contact이랑 Navigation은 딱히 아이디어가 안떠오르므로 그냥 깔끔하게 만들고 마무리하기로 했다. # Contact page 너무 간단한가... 싶긴 한데... 아이디어가 없.... 그래도 마지막까지 이걸 읽어보실 분들을 위해 Scroll Down 을 다 내리면 Scroll Down이 Thank you for watching으로 바뀌도록 해놓았다. export default function ContactComponent() { return ( Contact {images.email} E-MAIL swcho8220@gmail.com {images.github} GitHub https://github.com/dev-wann {images.blog} Blog https://d..
# 계획 프로젝트 파트의 컨셉은 폴더이다. 폴더를 한 장씩 넘겨가며 각 프로젝트 내용을 하나씩 보여줄 생각이다. 글로 설명하기 어려우니 최종 결과를 먼저 보여주자면, 이런 식으로 동작하게 된다. # 구현 TSX & CSS 먼저, 폴더의 전체적인 구조는 다음과 같다. // tsx PROJECTS Seungwan Cho Double click to close the folder {images.spine} {images.spine} 맨 앞 장인 하늘색 frontCover, 각 프로젝트 내용이 되는 Page, 맨 뒷장인 backCover, 그리고 넘어가는 페이지 아래에 회색 책등을 나타내는 'spine*' class div들로 구성된다. 코드를 처음 보며 의아할 점은, frontCover 및 page의 하위 d..
# 계획 About part에 포함하고자 하는 내용은 다음과 같다. 내 사진 컨셉과 이어지는 내 소개 커리어: 회사와 했던 일 간단히 설명 스킬 셋: 무슨 기술을 쓸 줄 아는지 학력 그런데, 2번이 나머지 항목과 좀 동떨어진다. 그렇다고 다양한 저걸 위한 파트를 하나 더 만들자니 지면이 아까운 느낌이다. 그래서 2번은 팝업 형식으로 따로 빼서 구현하기로 하였다. 간단한 도식은 다음과 같다. # 구현 - 레이아웃 화면은 크게 상단과 하단 두 부분으로 구성된다. 상단 소개문구와 사진은 flex, 하단 설명 파트는 grid를 이용해 구현하였고 내부적으로 flex, grid를 중첩하여 레이아웃을 구성하였다. 레이아웃 구성하는 부분은 딱히 특이사항이 없어 이런 형태로 구현하였다. - 팝업 소개글 아래 버튼을 누르..
# 목표 Intro 파트는 왜 굳이 이런 컨셉을 했는지 설명하는 페이지이다. 따라서 내가 왜 welcome page에 혜성 애니메이션까지 넣어가면서 이 페이지를 준비했는지를 내가 어떤 사람인지와 연결시켜서 설명하는 것이 목적이다. 따라서 3가지 이유를 들어 내가 왜 혜성과 연결되는지를 설명할 것이다. # 요구사항 1. 첫 화면은 welcome 화면과 자연스레 이어지도록 검은 화면에 제목 텍스트가 서서히 등장하도록 할 것 2. 3가지 요소를 스크롤에 따라 순차적으로 보여줄 것 아래 그림과 같이 스크롤에 따라 하나씩 콘텐트가 올라왔으면 한다. # 설계 요구사항 1. 일단은 그냥 텍스트만 넣고 본다. 추후 적당한 폰트를 찾으면 welcome page의 타이핑 효과 넣을 때 같이 넣을 생각이다. 요구사항 2. ..
