🔖 Story/⛵️ 취미 & 팁

[GitHub Actions] Private Repo로 Github Blog 배포하기

안녕하세요, 블로그 주인장 하댑입니다. 깃헙 블로그를 열심히 만들었는데 코드를 공개하고 싶지 않을때 보통 여러 호스팅 사이트를 이용해서 배포하는데요. 예전에 제가 간단하게 깃헙 블로그를 Gatsby로 생성해서 Netlify로 배포하는 튜토리얼을 포스팅한 적이 있습니다. 이번에는 Github에서 기본으로 제공하는 Github Page를 이용해서 개발자인거 자랑도 좀 하면서, 관련 코드 자체는 Private 하게 보관할 수 있는 방법을 알려드리겠습니다. 준비 과정 일단 기본 아이디어는 크게 두가지 Repo를 만들어서 사용합니다. - 사이트 정적파일을 업데이트할 Public Repo: { 본인의 깃헙 아이디 }.github.io - 정적파일을 빌드하기 위한 코드를 저장할 Private Repo: { 이름은 아..

[VS Code] 프론트엔드 개발자를 위한 확장 프로그램 추천

안녕하세요, 블로그 주인장인 주니어 개발자 '하댑'입니다. 오늘은 개발자가 보다 편리하고 빠르게 개발할 수 있도록 도와주는 대표적인 IDLE 프로그램인 비주얼 스튜디오 코드(VS Code)에서 제공하고 있는 확장 (extension plugin) 추천드리려고 합니다. 특히 프론트엔드 개발을 하면서 작업하는데 도움이 될만한 (주관적인 추천) 확장 프로그램을 추천합니다. 비주얼 스튜디오 코드 설치하기 1) https://code.visualstudio.com/ 으로 이동합니다. 2) VSCode 홈페이지 중앙 좌측 파란색 다운로드 버튼을 선택합니다. 운영체제에 맞게 자동 설정되는데, 아니라면 드롭다운으로 선택해주세요. 3) 설치파일 다운로드가 완료되면 VSCode를 설치합니다. VS CODE 확장 플러그인 ..

OBS 화이트 노이즈 제거 방법

*맥북 프로 M1 기준으로 작성되었습니다. 1인 유튜브, 인강 등을 녹화하실 때 화면과 함께 녹음을 진행하게 되는데요, 저는 이번에 OBS 프로그램을 처음 사용해보게 되었는데 사용법도 간단하고 무료라서 좋은것 같습니다! 그런데, 스튜디오가 아닌 자택에서 녹음을 하시게 되면 자연스럽게 화이트 노이즈가 발생하게 됩니다. 간단하게 제거하는 방법을 알려드릴게요. 1. 먼저 소스탭에 Audio Input Capture를 추가합니다. 이때, 화면 캡처에서는 음소거를 해주시는게 중요합니다. 2. 오디오 캡처에서 오른쪽 마우스 클릭 > 필터를 선택합니다. 3. 두가지 필터를 적용해봤습니다. 먼저 노이즈 억제 필터를 적용합니다. 4. 노이즈 억제할 때 어느 정도 범위를 잡을 건지 선택하는 부분인데 너무 많이 제거하면 음..

깃헙 프로필 꾸미기

Ver.3.0 가장 최근에 업데이트한 깃헙 프로필. 깃헙 프로필 사진은 zepeto에서 만든 아바타이다. 실제 모습을 반영한다기엔 커스터마이징을 많이 할 수 있어서 인형 옷입히기 게임에 가까운 느낌이다. 아무래도 좀 더 색상이 다양하게 꾸미고 싶었는데 마침 좋은 github 대문 템플릿을 발견해서 적용해봤다. 모양은 물결 모양 뿐만 아니라 다양하게 선택해서 사용할 수 있고, 색상은 랜덤으로 바뀌어 매번 새롭다. 참고 링크: github.com/kyechan99/capsule-render kyechan99/capsule-render :rainbow: Decorate Dynamic GitHub Profile !! Contribute to kyechan99/capsule-render development by..

[Marp] 마크다운으로 슬라이드 작성하기

마크다운 문법에 익숙한 사람들을 위한 Slide 작성용 프로그램을 소개합니다. 강의나 발표를 해야하는 자리에서 PPT 작성을 해야하는 경우가 종종 있습니다. 파워포인트가 딱히 익숙하지 않은 저에게 언제나 고통스러운 일이였는데요, 마크다운으로 작성한 문서를 그대로 슬라이드로 바꿔주는 툴이 있더라구요! Marp 를 소개합니다. 얼마 전에 발표에서 활용했는데, 선배님들이 좋게 봐주시더라구요. 원래 Mac, Window 용으로 프로그램을 다운받아 쓰는 형태였는데 최근 Marp Next로 넘어가면서 조금 더 개발자 특화된 형태,더 간편하게 만들어 제공하고 있습니다. 자세한 내용은 Marp 페이지에서 확인해보실 수 있습니다. VS Code 플러그인, Marp Cli 두가지 형태로 제공됩니다. Marp for VS ..

[Gatsby] 깃헙 블로그 시작하기

Gatsby로 개인 블로그 만들어보자. Gatsby? React와 Graphql을 사용하는 정적페이지 생성기입니다. GatsbyJS는 여러 Data Sources(CMSs, Markdown, Data-APIs, Databases, YAML, JSON, CSV, etc.)에서 가져와서 빌드 시점에서 정적 페이지를 만들어 내고 있습니다. 배포 시점에서 페이지 정보들이 만들어지기 때문에 앱서버가 따로 필요하지 않다는 장점이 있습니다. Why Gatsby? 지금까지 정말 많은 블로그를 전전해봤는데요... 일단 아직까지도 고민이긴 합니다. Tistory은 아무래도 시작하기가 편하고, 검색이 잘 되고 광고 플러그인을 달기도 간편해서 수익 올리기가 상대적으로 간편한 점이 있습니다. Medium은 세계적으로 유명한 블..