.jpg?w=960)
Svelte.js 입문 가이드
HEROPY
2시간이 넘는 입문자를 위한 Svelte.js 무료 강의!!
초급
Svelte
먼저 경험한 수강생들의 후기
이런 걸 배울 수 있어요
최신 Svelte.js의 Core API를 기초부터 탄탄하게 학습해요!
자바스크립트 데이터의 불변성(Immutable)과 가변성(Mutable)에 대해서 이해할 수 있어요!
자바스크립트의 비동기에 대해서 이해하고 여러 비동기 패턴을 학습해요!
Rollup.js의 기본 구성을 이해하고 추가 구성으로 실제 프로젝트를 만들어요!
Sortable.js를 핵심 모듈로 '트렐로(Trello) 클론 앱'을 만들고, Netlify 서비스에 가입하고 프로젝트를 지속적으로 배포(CD)할 수 있어요!
따끈따끈한 최신 자바스크립트 FE 프레임워크,
스벨트(Svelte.js)의 매력에 푹 빠져보세요!
시작하면서!
입문자를 위한 좀 더 쉬운 예제와 자세한 설명,
중급자 이상을 위한 Svelte API의 다양한 패턴과 새로운 문법 등,
Svelte를 학습하는 누구에게나 도움이 될만한 내용으로 구성했습니다!
홈페이지 예제보다 더 쉽게 이해할 수 있도록,
대부분의 파트 예제를 머리를 쥐어짜며 직접 준비했습니다!
강의를 곧바로 수강하지 않아도,
미리 보기를 통해서 Svelte의 기본 개념을 맛볼 수 있어요!
미리 보기 마지막에는 간단한 Todo 예제도 만들어 봅니다.
React, Vue 보다 더 쉽고 편리한 프론트엔드 프레임워크라는 것을 알게 되실 거예요~
그리고 전체 커리큘럼도 꼭 보세요!
작년(2019), 지금의 Svelte를 있게 한 3버전이 처음으로 공식 릴리즈되었어요.
이제 겨우 1년이 지난 아주 따끈하며 흥미롭고 매력적인 프레임워크에요~
필수 학습!
.gif)
주요 예제!
Svelte Core API 학습이 끝나면, 트렐로(Trello) 서비스의 클론 앱을 만들어요!
Rollup 번들러를 기반으로 프로젝트를 구성하고 여러 많은 기술을 도입합니다.(SCSS도 학습합니다)
최신 Snowpack 빌드 도구로 이관한 버전도 새롭게 추가했습니다!
Netlify 서비스를 사용해 GitHub 저장소를 기준으로 지속적인 배포(Continuous Deployment)도 진행해요~
더 자세한 내용은 커리큘럼을 참고하세요.
GitHub Repo: https://github.com/HeropCode/Svelte-Trello-app
Snowpack GitHub Repo: https://github.com/HeropCode/Svelte-Trello-app-Snowpack
Demo: https://boring-agnesi-165a0d.netlify.app
참고하세요!
초반 몇 개 강의가 지나가면 음질이 좋아집니다.
좀 더 비싸고 좋은 마이크로 바꿨어요~
질문이 있으면?
수강 중 질문이 생기면 질문 & 답변 페이지를 사용해 주세요.
최대한 빠르게 답변을 드리겠습니다.
수강이 고민되거나 기타 수강 전 궁금한 부분이 있다면,
수강 전 문의 페이지를 사용해 주세요.
Svelte 문서.
Svelte API에 대한 한글 문서가 필요하시면,
'Svelte.js 완벽 가이드(Renew)' 포스트를 확인하세요.
https://heropy.blog/2019/09/29/svelte
공지사항!
2020.10.22
강의 오픈 준비를 마친 상태에서 최신 Svelte 버전의 기술들이 몇 가지 추가되었어요.
곧 업데이트하겠습니다!
2020.11.03
'Svelte.js 완벽 가이드(Renew)'로 포스트를 업데이트했습니다.
영상 강의와 함께 보세요.
2020.11.08
이 강의에 다음 파트들을 추가했습니다!
- 7-4. 키 블록
- 11-4. 슬롯 포워딩(Forwarding)
- 18-1. Snowpack이란?
- 18-2. Snowpack 기반의 Svelte 템플릿 설치 및 구성 이해
- 19-1. 주요 디렉토리 복사 및 HMR 적용
- 19-2. 핵심 모듈 설치 및 구성
- 19-3. SCSS 및 Svelte Preprocess 구성
- 19-4. 제품 모드의 로그 제거 구성
- 19-5. 코드 최적화(최소화) 및 경로 별칭 구성
- 19-6. GitHub 저장소 생성과 프로젝트 Push
- 19-7. Netlify를 통한 지속적인 배포
2020.12.24
이 강의에 다음 파트를 추가했습니다!
'Trello 클론 앱 만들기' 강의 예제를 시작하기 전에 꼭 보세요!
- 15-1. 강의 예제 모듈 버전 일치시키기
2020.12.30
이 강의에 다음 파트를 추가했습니다!
- 11-5. $$slots
Svelte.js, Frontend, Framework, Core API, Sortable,js Rollup.js, React, Vue.js, Angular, 리액트, 뷰, 앵귤러
이런 분들께
추천드려요
학습 대상은
누구일까요?
새로운 최신 웹 프론트엔드 프레임워크를 경험하실 분!
프론트엔드 개발 경험이 부족하신 분!
Svelte.js 공식 문서로는 학습이 어렵거나 일부 이해가 안되시는 분!
설명이 많아도 괜찮으신 분!
선수 지식,
필요할까요?
HTML
CSS
JS
4,185
명
수강생
221
개
수강평
162
개
답변
4.9
점
강의 평점
3
개
강의
안녕하세요~ 반갑습니다!
저는 현재 작은 스타트업에서 기업 관리 솔루션을 개발하고 있는 프론트엔드 개발자 박영웅입니다.
HEROPY 기술 블로그를 운영하고 있고,
그 외 기업 출강이나 온/오프라인 강의 활동도 하고 있습니다.
Blog: https://heropy.blog
Youtube: https://www.youtube.com/channel/UCcjhMpoaNvyy0StN9KgtF6w
Email: thesecon@gmail.com
커리큘럼
전체
116개 ∙ (21시간 18분)
강의 게시일:
마지막 업데이트일:
수강평
전체
38개
4.9
38개의 수강평
madstone dev수강평 1
∙
평균 평점 5.0
5
99% 수강 후 작성하나의 개념을 설명하실때 부가적인 활용방법까지 엄청 꼼꼼하게 알려주시기 때문에 일반적으로 궁금할만한 사항들 대부분이 강의에 포함되어있다고 보시면됩니다. 또 es6의 장점을 최대한 활용해서 작성하시기 때문에 강의가 끝날 때쯤엔 깔끔하고 간결한코드의 습관도 기를 수 있습니다. 프레임워크 경험이없는분들이 듣기에도 아주 좋은 강의입니다. 다음 강의가 기대됩니다 ㅎㅎ
- HEROPY지식공유자
좋은 평가 남겨주셔서 정말 감사합니다. :D 완강 축하드리고, 이 강의가 madstone dev님께 많은 도움이 되었길 진심으로 바랍니다! 다음 강의도 열심히 준비해서 업로드하고 공지하겠습니다. 즐거운 하루 보내세요~ 감사합니다^^
- Taylor
수강평 2
∙
평균 평점 5.0
5
28% 수강 후 작성최근에 vue.js를 학습하는 과정에서 svelte 가 주목받고 있다는 정보를 들었습니다. 그래서 흥미를 가지게 되었고 구매를 하게 되었습니다. 아직 완강을 하진 못했지만 중간 소감을 적는다면 참 성의있게 강의를 준비하셨다는 느낌을 받습니다. 설계해주신 커리큘럼을 보니 이 강의에 대한 애착과 고민이 느껴집니다. 코멘트 적어주신 신규 기능에 대한 업데이트도 기다리고 있겠습니다
- HEROPY지식공유자
강의를 만든 보람이 느껴지는 감동적인 평가 감사합니다 :) 이 강의가 SIMONS 님께 많은 도움이 되면 정말 좋겠습니다. 신규 기능도 빠르게 업데이트하고 공지하겠습니다. 기분 좋은 하루 보내세요~
- 소라연
수강평 81
∙
평균 평점 5.0
5
98% 수강 후 작성샘플강의 듣고 반해서 수강합니다^^
- HEROPY지식공유자
좋은 평가 감사합니다^^ 다른 파트도 마음에 드셨으면 좋겠습니다! 즐거운 하루 보내세요~
다른 파트도 완전 마음에 들어요! 특히 Trello 예제는 너무 재미있어서 아껴듣는중입니다^^
- HEROPY지식공유자
다른 파트도 마음에 드셔서 다행입니다 :D Trello 예제도 재미있으시다니 정말로 기쁘구요ㅜㅠ Svelte.js가 소라연님의 웹 개발에 많은 도움이 되길 진심으로 바랍니다! 상쾌하고 행복한 주말 보내세요~
즐겁게 완강 했습니다. 감사합니다. 강의 정말 최고에요! 다음 강의도 기대하겠습니다. 강사님도 즐거운 주말 보내세요~
- HEROPY지식공유자
강의 시간이 짧지만은 않은데 완강하셨다니 진심으로 축하드려요 :D 다음 강의도 빠르게 열심히 준비해서 공지하겠습니다! 소라연 님도 즐거운 한 주 보내세요^^
- Truestar
수강평 26
∙
평균 평점 4.9
5
100% 수강 후 작성제가 리뷰는 잘 안하는 편인데 일단 강의 리딩 실력이 너무 출중하셔서 어떤 강의를 하셔도 주저없이 들을 것 같습니다. 강의 배속을 1.5 로 맞춰 재생하는데 그럼에도 발음이 좋은신 탓인지 내용이 쏙쏙 들어옵니다 중반정도 듣고있는데, 리뷰 남겨요! 0. 질의 응답을 괭장히 세세하게 설명해주십니다 1. 목차와 항목 구분이 강의내용과 확실히 매칭됩니다 2. 정보전달방식에 프레임이 있어, 매 강의 특정시점 마다 대략적으로 이런내용을 다루는구나 라고 짐작이 가능합니다. 3. 자주쓰이는 패턴 예시를 두어 응용하기가 좋습니다(유틸함수 쓰는 느낌) 4. 무엇보다 좋다고 생각이 드는부분은, 매 영상초반에 전달하는 전,후 맥락에 대한 설명을 가볍게 설명해주시는데 이 때문에 흐름을 파악하기 매우좋습니다 (때에 따라서 다소 지루한 감이 있을 순 있지만, 배속 기능이 있기에 상관없다 생각합니다. 저의 경우는 오히려 전체를 파악하기 좋았던 것 같습니다) 5. 골이 깊은 개념을 누구나 알기 쉽게 풀어서 설명합니다. 6. 각 주제를 단계적이고, 디테일 하고, 많은 예시를 두어 깊게 다룹니다. 몇 일간 장점을 정리해서 남길 정도로 추천합니다. 무엇보다.. 혜자스러운 강의 분량에 감탄을 했습니다.
- HEROPY지식공유자
앗! Truestar 님 안녕하세요. '질문 & 답변'에서 글 정리하시는 데 많은 공이 들어간다고 답변해주신 거 같은데, 이렇게 장문의 멋지고 깔끔한 수강평을 남겨주시니 정말 감동적입니다ㅠㅜ 남은 중반 이후 강의가 Truestar 님께 실망을 안겨드리지 않았으면 좋겠고, 정말 도움이 많이 되시길 희망합니다!! 그럼 좋은 밤 되시고, 즐겁고 행복한 한 주 보내시길 바라요~👍 멋진 수강평 진심으로 감사드립니다~😭
아이고.. 제가 가 오해할만한 얘길 남긴건가요?^^; 전 그냥 제가 강의노트를 책쓰듯 하는 버릇이 있어서 공이 많이 들어간다는 소릴 짧게 남겨서 오해가 있으셨네요.. 강의 정말 좋아요.. `고퀄`이 어울리는 강의 입니다. 박리다매 가 떠오르는건 저만 그런건가요.. 업데이트도 계속 해주셔서 감사할 따름이지요.. 이 강의 만드시느라 든 노고가 느껴지는 강의입니다 기초 끝내고 응용편 에서도 잘 부탁드립니다!
₩53,900
HEROPY님의 다른 강의
지식공유자님의 다른 강의를 만나보세요!
비슷한 강의
같은 분야의 다른 강의를 만나보세요!
![GraphQL 완전정복 (키오스크를 만들며 배우는 풀스택 과정) - [2024 부분 리뉴얼]강의 썸네일](https://cdn.inflearn.com/public/courses/329186/cover/a63c6c95-2318-4e7a-a4f0-34d4512b3ae6/329186-eng.png?f=avif&w=420)
