본론으로 들어가기에 앞서, 개인적인 이야기를 몇 자 풀어보자면, 벌써 나의 개발자 인생도 반년을 채웠다. 앞으로도 개발자로 살 예정인데 언제까지 윈도우만 고집할 수 없어서 맥북을 배워보기로 하고, 정말 큰 마음을 먹고 거금을 들여 중고 맥북프로를 구매했다. 그리고 구매한 맥북이 도착한 다음날이었던 어제, 퇴근 2시간 전에 기존에 사용하던 윈도우 노트북의 터치패드가 고장났다.🥲나는 작업할 때 왼손은 터치패드에, 오른손은 마우스를 쥐고 하는게 습관이다. 클릭도 마우스보다 터치패드로 하는걸 선호하는데, 이게 갑자기 고장나니까 작업이 쉽지 않았다. 맥북에 천천히 적응하려고 했는데, 공교롭게도 윈도우 터치패드가 고장나서 오늘부터 출퇴근 시에 맥북을 써야했기 때문에, 개발환경 설정을 빨리 해야했다.일단 Chrom..

예전에 깃허브 프로필에 티스토리 최신글 확인해서 보여주는 카드 위젯이 있었는데, 지원이 끊어져서 엑박으로 나오길래 삭제했다. 티스토리 꾸준히 작성하고 있는걸 깃허브에서도 보여줄 수 있으면 좋을 것 같다고 계속 생각하고 있었는데, 아래 레포와 블로그 글을 읽고 RSS 통해서 최신글 정보를 끌고오면 된다는걸 알게 됐다.실제로 실험을 해봤는데 제대로 안 되는거 같아서 일단 깃허브에서 해당 파일을 삭제했다..뭐가 문제였는지 모르겠음.. 나중에 다시 자세히 읽어보고 시도해봐야지!😂https://github.com/gautamkrishnar/blog-post-workflow GitHub - gautamkrishnar/blog-post-workflow: Show your latest blog posts from a..

10월에 SSH를 배운 이후로, 우리 회사의 자체 서비스는 무조건 SSH 원격접속으로 작업하고 있다. 이제 SSH 접속해서 코딩하는 일은 손에 익었는데, 이번에 작업 도중 png 파일을 svg로 변환해서 디렉토리에 넣어야 하는 경우가 생겼다.👀디렉토리가 로컬에 있다면 svg로 변환한 파일을 바로 넣으면 되는데, 원격접속한 리눅스 서버 환경에는 어떻게 넣어야하는지 몰라서 방법을 찾았다. 내가 win10을 사용하고 있으니까 Windows PowerShell이나 vscode 터미널에서 scp 명령어를 사용하면 된다고 해서 실험했는데, SSH 환경인 리눅스 서버와 로컬(내 컴퓨터)가 연결이 안 되어있어서 자꾸 에러가 났다.😥어떻게든 문제를 해결하려던 찰나에, 사수님이 'FileZilla'라는 프로그램을 알려..

며칠 고생했던걸 기록해둬야할 것 같아서 적어보는, 일기 같은 실험기록.✍내가 앞으로 만들게 될 실서비스가 API로 데이터를 불러오는 부분이 많아서, 데이터를 직접 만져보는게 프론트엔드 측에서 페이지를 만들 때에도 도움이 될 것 같다는 사수님의 제안에 따라, VS code에서 SSH로 서버에 원격접속을 해서 가상의 데이터를 만들기로 했다. 구글링을 통해 VS code로 SSH 원격접속하는 방법을 미리 공부해뒀고, 얼마 후에 백엔드 전문이신 사수님이 서버를 만들고 관련 정보들을 알려주셔서 공부한대로 원격접속을 시도했다.그런데 여기서부터 약간의 삽질이 시작된다..😂일단 VS code에서 Remote SSH 관련 익스텐션을 설치하려고 보니까 이미 설치가 되어있었다.언제 설치했는지 기억도 안 나지만, 아무튼 이..

웹 포트폴리오 페이지를 React로 리뉴얼하면서 About 페이지를 따로 만들어서, 한 문단씩 GSAP의 스크롤 트리거 사용해서 등장하도록 설정했다. 웹에서는 잘 보이는데 모바일로 천천히 스크롤을 내리면 나중에 있는 요소들이 안 보이는 문제가 있어서 속도를 조절했다.나중에 까먹을까봐 블로그에 정리해둔다.✍gsap.fromTo( paragraph, { opacity: 0, y: 20, }, { opacity: 1, y: 0, scrollTrigger: { trigger: paragraph, start: 'top 100%', end: 'bottom 0%', toggleActions: 'play n..

포트폴리오를 만들려고 구글에 예시를 검색했다가 웹페이지형 포트폴리오를 여럿 보았는데, 깔끔한 디자인과 생동감있는 화면에 감탄했다. 개발자를 지망하는 경우, ppt 형식 외에도 웹페이지형 포트폴리오를 만들어 주소를 공유하는 형식도 많이 사용한다고 해서 나도 만들고 싶어졌고, 어디에 어떻게 만들어야할지 찾다가 github.io 라는 깃허브 페이지를 알게 됐다. 현재 듣고 있는 SeSAC 수업 리더님께 "웹페이지형 포트폴리오 만들기에는 github.io가 깃허브에서 연결할 수 있고 배포하기도 쉽다"는 조언을 듣고, 나도 깃허브 페이지를 만들기로 했다.🙌github.io 만드는 방법github.io 페이지를 만들기 위해서는, 우선 자신의 github 프로필에서 repo를 만들어야 한다."아이디.github.i..

예전에 배운 내용 블로그에 다시 기록하는 중..✍이번 포스팅에서는 웹페이지를 배포하는 방법에 대해 기록하려고 하는데, 그 전에 서버와 클라이언트의 관계를 알아야하기 때문에 그것부터 설명하고, 추가적으로 git 자격증명을 받는 방법까지 서술하도록 하겠다.서버와 클라이언트 우리가 브라우저에서 특정 웹페이지로 이동하기까지는 우리가 모르는 수많은 과정이 존재한다.예를 들어, 티스토리에 들어오기 위해 'tistory.com'이라는 주소를 브라우저에 입력했다고 가정해보자.1. 브라우저는 tistory.com 의 ip주소를 찾기 위해 DNS를 조회한다.2. DNS 서버는 tistory.com 이라는 영문 주소를 IP 주소로 변환해서 브라우저에 제공한다.3. 브라우저가 DNS 서버에게 받은 IP 주소를 가지고 웹 서버..