Hong Cheung 
배경
저는 항상 무언가를 만드는 데 관심이 많았습니다. 프로그래밍은 바로 그 일을 가능하게 해 줍니다.
올해 4월부터 100 Days Of SwiftUI를 통해 Swift(iOS)를 배우기 시작했고, 7x일 차까지 따라가며 몇 개의 앱을 만들어 앱스토어에 출시했습니다. Swift는 UI와 로직을 같은 언어로 처리할 수 있어서 좋습니다.
그런데 문득 웹의 잠재력이 더 클 수도 있겠다는 생각이 들었습니다. 웹은 자유도가 더 높으니까요. 앱을 심사받을 필요도 없고, 개발자 계정에 비용을 낼 필요도 없으며, 원하는 스택을 자유롭게 고를 수 있습니다. 특히 애플리케이션을 크로스 플랫폼으로 만들고 싶다면 더욱 그렇습니다.
웹 개발 학습
iPhone용 작은 앱 몇 개를 만든 뒤, 지난 3~4개월 동안 freeCodeCamp와 Odin Project를 조금씩 활용해 웹 개발을 배우기 시작했습니다.
웹 개발이 필요한 이유는 모바일 프로젝트를 위한 앱 랜딩 페이지를 만들고, 모바일 앱에서 사용할 REST API도 만들고 싶기 때문입니다.
- FreeCodeCamp
- 실습이 많습니다. 다만 실제로 해 보니 조금 부담스럽고 반복적이라는 느낌이 들었습니다.
- The Odin project
- 이론이 더 많고, 프로그래밍이 왜 그리고 어떻게 작동하는지에 대한 깊은 이해를 얻을 수 있습니다.
그래서 두 가지를 동시에 하는 것을 추천합니다. 하나가 다른 하나에 도움이 됩니다.
저는 freeCodeCamp에서 “Responsive Web”, “Basic JavaScript”, 그리고 “React”의 절반만 끝낸 상태입니다 - 지금까지는요.
제 학습은 주로 텍스트 정보와 공식 문서에 기반했습니다. React와 NextJS 공식 튜토리얼은 정말 즐겁게 했습니다.
유료 온라인 강의에는 전혀 돈을 쓰지 않았습니다.
대부분 과제 중심 학습이었습니다 - 하고 싶은 그 한 가지를 배우고, 다음 것으로 계속 넘어가는 방식입니다.
지금까지의 나의 프로그래밍 여정
Swift & 약간의 로컬 SQLite > 간단한 Flask REST API > HTML/CSS > JavaScript > 11ty (정적 사이트 생성기) > React (공식 튜토리얼) & NodeJS > Next.js (공식 튜토리얼) > ExpressJS > REST API 보안 (CORS & 환경 변수) > React 복습 (freeCodeCamp) > …
모두가 프로젝트를 만드는 것이 중요하다고 말했고, 저도 매우 동의합니다
만들고 싶은 것이 아니었다면 흥미를 잃었을 것입니다. 한 프로젝트를 오래 하다 지치면, 다른 언어로 된 또 다른 프로젝트로 바꿔서 자극을 받곤 했습니다. 과제 중심 학습이 저에게 가장 잘 맞습니다.
제가 사용한 초보자 친화적인 무료 호스팅 몇 가지
- GitHub page
무료 요금제에서는 저장소를 공개해야 게시할 수 있습니다. 그래도 도메인은 연결할 수 있습니다.
GitHub와 연결하기가 매우 쉽고, 문의 양식 지원이 내장되어 있어 자체 서버가 필요 없습니다. Netlify CMS 인증과 연동하면 정적 블로그에 로그인할 수도 있으며, 모두 무료입니다. (단점은 Next Image 지원이 없다는 것 - 즉 <Image> 최적화를 활용할 수 없습니다. 이를 위해서는 Vercel을 쓸 수 있지만 문의 양식 지원을 잃게 되니 선택은 본인 몫입니다. 제가 이걸 아는 이유는 NextJS 사이트를 Netlify에 배포하다가 오류를 겪었기 때문입니다.)
UI는 Netlify에 비해 멋지거나 초보자 친화적이지는 않지만, 무제한 대역폭, 무료 호스팅, 심지어 제한적이지만 사용할 수 있는 클라우드 함수도 제공합니다. Netlify만큼 초보자 친화적이지는 않았지만 그렇게 어렵지도 않았습니다. 기본적으로 필요하고 원하는 모든 것을 무료로 제공합니다. 그리고 도메인도 여기서 구입했기 때문에 지금은 제가 주로 쓰는 정적 호스트입니다.
무료 백엔드 호스트
제 첫 백엔드였습니다. 기본적인 용도로는 사용하기 매우 쉽습니다. CPU 계산 시간이 제한되어 있어 무료로 큰 처리 작업을 돌리기는 어렵습니다. 하지만 항상 실행 중이기 때문에 RESTful API에는 아주 좋습니다.
Express.js 호스팅을 위한 제 새로운 선택지입니다 - 단점은 15분 동안 비활성 상태이면 자동으로 중지된다는 것입니다. JavaScript 서버를 호스팅할 수 있는 무료 상시 서버는 아직 찾지 못했습니다. 다만 중지되지 않는 서버는 월 약 $7로 그렇게 비싸지 않고, 직불 카드를 받는다는 점이 마음에 듭니다. UI도 쉽습니다.
아니요, 저에게는 너무 부담스러웠습니다. 하지만 합리적인 가격에 확장성이 가장 뛰어난 서비스 중 하나인 것 같습니다. 웹사이트 UI가 초보자 친화적이지 않고 VPS에 대해 잘 모르기 때문에 아직 손대지 못했습니다.
Google Cloud는 무료 요금제라도 시작하려면 신용카드가 필요해서, 마침 없었습니다. Firebase는 인증 시스템을 무료로 쉽게 구축하기에 좋습니다. 나중에 살펴볼 예정입니다.
웹사이트 게시 전 과정을 배우기 위해
HTML/CSS와 기본 JS로 간단한 웹사이트 몇 개를 만든 뒤, 블로그를 만들고 싶었습니다. 정적 사이트 생성기가 정말 많다는 것을 알게 되었습니다. Hugo, 11ty 등으로 템플릿을 검색했습니다. NodeJS를 어떻게 다루는지 이해하는 데 매우 좋았습니다. 이런 템플릿을 다루려면 약간의 코딩 로직만 필요하지만, 웹사이트를 만드는 전 과정을 연습할 수 있기 때문입니다:
Creating a new git repository > create the site with NodeJS > connect & auto push to 3rd party host > manage your domain > compare the features & price for each web host to best suits your objective or language.대부분의 프로젝트에서 다른 부분은 “create the site with NodeJS”뿐이며, 여기서는 Python을 써도 되지만 배운 다른 것들은 여전히 적용됩니다.
블로그 만들기에 대해 더
가장 큰 어려움은 블로그 기능 자체가 아닙니다. 바로 댓글 섹션입니다. 초보자로서 블로그를 쓰고 콘텐츠에 집중하고 싶다면, 그냥 WordPress를 쓰는 것을 추천합니다. 모든 것이 제공되고 번거로움이 없습니다.
그렇지 않다면 정적 블로그에 댓글 섹션을 통합하기 위해 Disqus를 사용할 수 있습니다(프라이버시 문제와 메모리를 많이 잡아먹는 로딩으로 평판이 좋지 않습니다). 또는 GitHub 로그인을 지원하는 오픈 소스 대안을 사용할 수도 있습니다. 하지만 제가 아는 한 무료이면서 Google 로그인을 허용하는 것은 하나도 없습니다. 아니면 자체 백엔드 댓글 서버를 만들 수도 있지만, 그러면 스팸 필터링 같은 것도 처리해야 합니다. 저에게는 그다지 이상적이지 않았습니다. 결국 그냥 Disqus를 사용했지만, 로딩 시간을 절약하기 위해 사용자가 “Show comments”를 클릭할 때까지 자동 로드되지 않게 했습니다.
ChatGPT에 대해
어느 정도까지만 도움이 됩니다. 복잡한 로직에는 사용하지 마세요. 보통 문제가 생깁니다. 짜증나는 문제 중 하나는 코드를 변경하면서 그 사실을 알려주지 않는 것입니다. 초안에는 도움이 됩니다. 버그 없는 코드를 원한다면 적합하지 않습니다. 절대 그렇게 해 주지 않습니다. 또한 코드를 다시 검토해 달라고 요청할수록 오류가 더 많이 생긴다는 것도 깨달았습니다. 그냥 직접 배워서 작성하는 것보다 짜증나고 시간이 많이 걸렸습니다.
다음은
회원가입/로그인 인증과 SQL 데이터베이스 서버를 갖춘 실제 백엔드를 구축하는 방법을 배우려고 합니다. 이번에는 Django를 시도해서 크로스 플랫폼 앱에서 작동하는 백엔드를 만들어 볼지도 모르겠습니다.
목표
계속 배우고 흥미로운 프로젝트를 만드는 것.
읽어 주셔서 감사합니다!
