[웹 개발 기초] 1화: 코딩 준비와 HTML로 웹사이트 뼈대 세우기
VS Code와 Live Server로 개발 환경을 갖추고, HTML 기본 구조와 시맨틱 태그(nav, header, section, footer)를 활용해 포트폴리오 사이트의 뼈대를 직접 코딩해보는 입문 가이드.
[2026 동계 올림픽] 컬링 ‘5G’팀과 함께하는 초보자 컬링 완벽 가이드
2026 밀라노·코르티나담페초 동계 올림픽에 출전 중인 여자 컬링 ‘5G’ 팀을 소개합니다. 하우스 점수 계산과 스위핑 원리 등 컬링 규칙을 확인하고, 우리 선수들의 정교한 전략과 마인드 컨트롤을 함께 응원해 주세요!
AWS Lambda #3: 코드 수정은 이제 그만! ‘환경 변수’로 스마트하게 관리하기
리사이징 크기나 폴더명을 바꿀 때마다 코드를 고치시나요? 환경 변수를 활용하면 AWS 콘솔에서 설정값만 바꿔도 즉시 반영됩니다. 보안과 편의성을 모두 잡는 환경 변수 활용법을 알아봅니다.
AWS Lambda #2: 5분 만에 만드는 S3 이미지 리사이징 자동화
S3 버킷 생성부터 Lambda 연동, Sharp 라이브러리 활용까지 전 과정을 ‘따라하기’ 식으로 구성했습니다. 복잡한 이론 대신 실제 클릭 순서와 핵심 코드를 담아 누구나 서버리스 이미지 처리 시스템을 구축할 수 있습니다.
AWS Lambda #1: 서버리스 개념부터 첫 함수 생성과 비용 관리까지
서버 관리 부담을 줄이고 비용을 혁신적으로 아끼는 AWS Lambda 입문서입니다. 서버리스의 핵심 개념, 가성비 높은 프리티어 혜택, 그리고 5분 만에 직접 함수를 만들고 테스트하는 실습 과정까지 개발자의 시선에서 상세히 담았습니다.
[Next.js 시리즈 #5] 피날레: Vercel로 세상에 내 웹사이트 공개하기
Next.js 시리즈 대망의 마지막 편! Vercel과 GitHub을 이용해 내 프로젝트를 3분 만에 전 세계로 배포해 봅니다. 처음 사용자들을 위한 GitHub 설치(Install) 권한 승인 과정부터 보안을 위한 환경 변수 설정까지 상세히 담았습니다.
[Next.js 시리즈 #4-1] About 페이지 만들기
Next.js 시리즈 보너스 편! 나만의 정체성을 담은 ‘소개(About)’ 페이지를 만들어 봅니다. 깔끔한 Tailwind CSS 레이아웃을 활용해 보유 기술과 가치관을 효과적으로 전달하는 방법을 입문 개발자의 시선에서 세련되게 정리했습니다.
[Next.js 시리즈 #4] 실전 Data Fetching: ‘프로젝트’ 페이지 데이터로 채워보기
Next.js 시리즈 4부! 기존 레이아웃의 ‘프로젝트’ 메뉴를 실제 데이터로 채워봅니다. fetch API와 Interface를 활용해 외부 데이터를 안전하게 불러오는 실전 Data Fetching 과정을 초급 개발자의 눈높이에서 담았습니다. 이어지는 보너스 편 ‘소개 페이지 만들기’도 놓치지 마세요!”
[Next.js 시리즈 #3] 디자인의 완성: Tailwind CSS로 세련된 UI 컴포넌트 만들기
Next.js 시리즈 3부! Tailwind CSS를 활용해 밋밋한 웹사이트에 생명을 불어넣어 봅니다. 클래스 몇 줄로 세련된 히어로 섹션을 만들고, 주니어 개발자도 바로 써먹을 수 있는 실무 디자인 팁까지 알차게 담았습니다. 디자인 고민, 이제 코드로 해결해 보세요
[Next.js 시리즈 #2] 기초 설계: App Router와 공통 Layout 한 번에 잡기
Next.js 2부! 프로젝트의 뼈대인 App Router와 공통 레이아웃을 직접 구현해 봅니다. 헤더와 푸터를 한 번만 만들어 모든 페이지에 적용하는 효율적인 설계 방식을 입문 개발자의 눈높이에서 아주 쉽고 친절하게 풀어냈습니다. 함께 성장해 볼까요?