.jpg?w=1400)
Svelte.js Beginner's Guide
heropy
Free Svelte.js course for beginners over 2 hours long!!
초급
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
안녕하세요
HEROPY입니다.
4,146
명
수강생
217
개
수강평
162
개
답변
4.9
점
강의 평점
3
개
강의
안녕하세요~ 반갑습니다!
저는 현재 작은 스타트업에서 기업 관리 솔루션을 개발하고 있는 프론트엔드 개발자 박영웅입니다.
HEROPY 기술 블로그를 운영하고 있고,
그 외 기업 출강이나 온/오프라인 강의 활동도 하고 있습니다.
Blog: https://heropy.blog
Youtube: https://www.youtube.com/channel/UCcjhMpoaNvyy0StN9KgtF6w
Email: thesecon@gmail.com
커리큘럼
전체
116개 ∙ (21시간 18분)
3. 3. REPL 사용법
09:26
9. 4. 컴포넌트
18:29
10. 5. 스토어
17:19
12. 1. 기본 개념
05:34
17. 6. tick
06:19
강의 게시일:
마지막 업데이트일:
수강평
전체
37개
4.9
37개의 수강평
hanbin85705100수강평 1
∙
평균 평점 5.0
5
99% 수강 후 작성When explaining a concept, you will be very meticulous in explaining additional usage methods, so you can see that most of the things you are generally curious about are included in the lecture. Also, since you write by making the most of the advantages of ES6, you will be able to develop the habit of writing clean and concise code by the end of the lecture. This is a very good lecture for those who do not have framework experience. I look forward to the next lecture ㅎㅎ
- heropy지식공유자
Thank you so much for your great review. :D Congratulations on completing the course, and I sincerely hope that this lecture was helpful to madstone dev! I will prepare the next lecture diligently and upload it and announce it. Have a nice day~ Thank you^^
- sorayeon
수강평 81
∙
평균 평점 5.0
5
98% 수강 후 작성I took the class because I liked it after listening to the sample lecture^^
- heropy지식공유자
Thank you for your good review^^ I hope you like other parts too! Have a nice day~
I really like the other parts too! Especially the Trello example is so fun that I'm saving it for later^^
- heropy지식공유자
I'm glad you like the other parts too :D I'm really glad you enjoyed the Trello exampleㅜㅠ I really hope Svelte.js will be of great help to Sorayeon's web development! Have a refreshing and happy weekend~
I had a great time. Thank you. The lecture was really great! I look forward to the next lecture. I hope you have a great weekend too, instructor~
- heropy지식공유자
The lecture time was not short, but I sincerely congratulate you for completing it :D I will prepare the next lecture quickly and diligently and announce it! I hope you have a great week, Sora Yeon^^
- truestar
수강평 26
∙
평균 평점 4.9
5
100% 수강 후 작성I don't usually write reviews, but since your lecture reading skills are so outstanding, I think I would listen to any lecture without hesitation. I play the lecture at 1.5 speed, and even then, I can hear the content very well, perhaps because of your good pronunciation. I'm only halfway through listening, so I'm leaving a review! 0. You explain the Q&A in great detail. 1. The table of contents and the division of items are clearly aligned with the lecture content. 2. There is a frame in the information delivery method, so you can roughly guess what kind of content is being covered at each specific point in the lecture. 3. It is easy to apply by providing examples of frequently used patterns (it feels like using a utility function) 4. The best part is that it briefly explains the context before and after the beginning of each video, which makes it very easy to understand the flow (It may feel a bit boring at times, but I think it doesn't matter because there is a speed-up function. In my case, it was actually good for understanding the whole thing) 5. It explains deep concepts in a way that anyone can easily understand. 6. It covers each topic in depth step by step, in detail, and with many examples. I recommend it so much that I will write down the advantages for a few days. Above all, I was impressed by the generous amount of lectures.
- heropy지식공유자
Oh! Hello Truestar. I think you answered in the 'Questions & Answers' that you put a lot of effort into organizing the text, so I'm really touched that you left such a long, nice, and neat reviewㅠㅜ I hope the remaining lectures after the middle part won't disappoint Truestar, and I really hope they'll be of great help!! Then, have a good night, and have a fun and happy week~👍 I sincerely thank you for your nice review~😭
Oh my.. Did I leave something that could be misunderstood?^^; I just have a habit of writing my lecture notes like a book, so I briefly mentioned that a lot of work went into it, so there was a misunderstanding.. The lecture is really good.. It's a lecture that suits `high quality`. Is it just me that thinks of 박리다매.. I'm grateful that you keep updating it.. This lecture shows the effort that went into making it. I hope you'll do well in the application section after finishing the basics!
- simongs
수강평 1
∙
평균 평점 5.0
5
28% 수강 후 작성Recently, I heard that Svelte is gaining attention while learning Vue.js. So I became interested and bought it. I haven't finished the course yet, but if I were to write an intermediate review, I feel that you have prepared the course with great sincerity. Looking at the curriculum you designed, I can feel your affection and concern for this course. I will also wait for updates on the new features you commented on.
- heropy지식공유자
Thank you for the touching evaluation that makes me feel the worth of making the lecture :) I really hope this lecture will be of great help to SIMONS. I will also update and announce new features quickly. Have a nice day~
HEROPY님의 다른 강의
지식공유자님의 다른 강의를 만나보세요!
비슷한 강의
같은 분야의 다른 강의를 만나보세요!
![Complete Mastery of GraphQL (Full-stack Course Learning by Building a Kiosk) - [2024 Partial Renewal]강의 썸네일](https://cdn.inflearn.com/public/courses/329186/cover/a63c6c95-2318-4e7a-a4f0-34d4512b3ae6/329186-eng.png?w=420)
