인프런 - 라이프타임 커리어 플랫폼

간단한 마크다운 메모 웹 애플리케이션을 만들어봅니다. Notion처럼 마크다운을 사용할 수 있는 스티커 메모지에요!

이 강의를 통해 리액트와 노드등의 개념만이 아닌, 실질적으로 어떻게 웹 사이트를 만드는지를 배울 수 있습니다.

테스트를 먼저 설계하면, 구현은 AI가 대신합니다. 개발 속도와 품질을 동시에 잡는 실무형 개발 방식!

이 강의는 Vanilla JavaScript로 Notion을 처음부터 끝까지 직접 구현하며, 단순한 UI 클론을 넘어서 내부 동작 원리를 깊이 이해하는 데 초점을 맞춘 풀스택 수준의 프런트엔드 프로젝트 과정입니다. 사이드바 트리, 중첩 문서 생성, 자동 저장, 라우팅, 휴지통, 즐겨찾기, 검색 모달, 설정 모달, 테마 전환, Export/Import, 키보드 단축키, 반응형 레이아웃, 드래그 리사이즈 등 실제 노트 앱의 핵심 기능을 모두 바닐라 JS로 직접 구현합니다. React, Vue 같은 프레임워크 이전에 반드시 알아야 할 브라우저 표준 동작(이벤트 버블링, DOM 트리, 로컬 스토리지, Blob, FileReader, 해시 라우팅 등)을 탄탄하게 학습해, “왜 이렇게 동작하는가”를 완전히 이해하고 디버깅할 수 있는 내공을 쌓는 것이 목표입니다.

웹 개발에 필수적인 기본 개념과 원리를 실습을 통해서 학습합니다.

애드센스 수익형 웹사이트를 만드는 방법을 정리했습니다. 개발 경험이 없어도 따라올 수 있도록, 성공한 방식만 남겨 그대로 재현할 수 있게 구성했습니다.

PWA로 서비스 중인 웹 페이지를 앱 서비스로 만들어보세요! 간단하게 PWA, 앱 제작을 경험해보고 싶으신 분들에게 권해드립니다.

안녕하세요 여러분. 제 강의 Master Website Creation 2026 - 15 Website Platforms in 1 Course에 오신 것을 환영합니다 - WordPress, Wix, Weebly, Shopify, Squarespace, GoDaddy, Zoho Sites, Site123, Duda, BigCommerce, Strikingly, Pagecloud, Jimdo, Tilda 그리고 Simvoly를 다룹니다. 제 강의에서는 모든 웹사이트 제작에 관한 모든 것을 배우게 됩니다. 저는 15개 웹사이트 제작 플랫폼의 모든 기능에 대한 비디오 강의를 만들었습니다. 이러한 플랫폼의 모든 기능을 사용하는 방법에 대한 실제 실무 구현을 보실 수 있습니다. 이것은 인터넷에서 찾을 수 있는 15개의 서로 다른 웹사이트 제작 플랫폼에 관한 가장 상세한 강의입니다. 저는 각 플랫폼에 대해 서로 다른 섹션을 만들었으며, 비즈니스를 위한 멋진 실용적인 웹사이트를 구축하기 위해 플랫폼을 사용하는 방법을 심도 있게 보여드렸습니다. 이 강의는 웹사이트 제작에 대한 100% 이해를 제공할 것이며, 이 강의를 마친 후에는 여러분 자신과 고객을 위한 웹사이트를 구축하는 데 이러한 개념을 적용할 수 있게 될 것입니다.

글로벌 기업들의 차세대 모바일 전략, PWA(프로그레시브 웹 앱)를 배우자!

React 가 처음이라면? React의 기본 개념을 튼튼히 하면서도 빠르게 배울 수 있는 방법을 고민해야 합니다. Next.js와 JavaScript로 최소한의 지식으로 시작해 보세요. 실무에서 개발에 필요한 필수적인 예제들만 간추려 개발해 봅시다. Todo 예제는 너무나 중요하므로 2번 개발해야 합니다. 한번은 컴포넌트 중심으로 다음에는 브라우저의 경로에 맞게 처리되는 라우팅 중심으로! 로그인은 Zustand를 이용하세요! 정말 적은 양의 코드로 전역 상태를 처리할 수 있습니다.

JS를 쓰고는 있지만 왜 되는지 설명하기 어렵다면, 이 강의가 그 답을 드립니다. 실행 컨텍스트, 클로저, 이벤트 루프부터 Promise 동시성, 프로토타입, 가상 DOM, 메모리 누수, 번들 최적화까지 - JS 고급 개념 18챕터를 읽는 것이 아니라 시뮬레이터로 직접 눈앞에서 확인하며 학습합니다. 챕터마다 코드 기반 퀴즈가 제공되며, 치킨 한 마리 값으로 평생 소장할 수 있습니다.

자바스크립트를 배웠는데, 실제 프로젝트에서 막히시나요? forEach는 쓸 수 있는데 reduce는 손이 안 가고, 비동기 코드는 볼 때마다 머리가 아프고, 컴포넌트를 만들어도 왜 이렇게 짜야 하는지 이유를 모르는 분들을 위해 이 강의를 만들었습니다. 이 강의는 단순히 문법을 설명하지 않습니다. "왜 이렇게 쓰는가" 를 중심으로, 실무에서 바로 꺼내 쓸 수 있는 코드 감각을 키워드립니다.

단순히 듣고 끝나는 강의가 아닙니다. 이 강의는 “React를 이해하는 순간”이 아니라 “React를 직접 다룰 수 있게 되는 순간”을 목표로 합니다. 매 섹션마다 강의와 함께 미션을 수행하고, 연습문제를 직접 풀며, JSX, Virtual DOM, State, useEffect 같은 핵심 개념을 손으로 구현하며 익히는 과정입니다. 완강을 마쳤을 때 당신은 단순히 React 문법을 아는 입문자가 아니라, 컴포넌트 설계부터 렌더링 흐름까지 스스로 설명하고 활용할 수 있는 개발자가 되어 있을 것입니다. “듣기만 하는 수업이 아닌, 완성해 나가는 학습.” React의 본질을 이해하고, 선언형 UI의 세계를 직접 체험하세요.

생성형 AI(Chat GPT, Cursor AI)를 통해서 웹 사이트 개발과 배포하는 과정을 전반적으로 학습합니다.

이 강의를 통해 수강생은 개발 환경 설정부터 변수, 조건문, 함수, 객체, 배열 등 JavaScript의 기초와 심화 개념을 폭넓게 학습합니다. 실습과 퀴즈로 꼼꼼히 복습하여, 웹·모바일 실무에 바로 적용 가능한 문제 해결 능력을 갖출 수 있습니다.

최소한의 이론으로 데스크탑앱만들기! 프로그래밍 경험이 없어도 누구나 시작하는 앱만들기!

누구나 배울 수 있는 쉬운 코딩을 만들겠습니다. 코딩이 무엇인지 이해하고 라이브러리, API 등 최대한 외부 자원을 활용하여 서비스 가능한 웹과 앱을 제작하는 것이 목표입니다.

이미지를 업로드하면 Opencv가 처리하여 얼굴을 검출해주는 웹앱을 만들어 봅니다.

3년차 프론트엔드 개발자가 가장 쉽게 알려주는 TodoList 만들기 강의입니다.

이 강의는 초보 Javascript 개발자가 직접 Real 웹앱을 개발할 수 있는 개발자가 되는 것에 초점을 맞추고 있습니다. 이 강의를 수강하시면 Vue.js 와 관련된 기본적인 개념부터 Real 웹앱 개발을 해 볼 수 있습니다. 이 강의는 1부 기본기 이며, 2부와 3부를 통해서 실제 Real 웹앱을 구현해 보도록 하겠습니다. Javascript 나 CSS 와 같은 선수지식 없이도 기본적인 간단한 Html 만 알아도, 학습할 수 있도록 쉽게 구성하였습니다. 강의 후반부가 되면, 분명 Vue.js 에 대한 기본 코딩이 가능할 수 있을 것입니다.