Svelte.js入門ガイド
HEROPY
2時間を超える入門者のためのSvelte.js無料講義!
Basic
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 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,192
명
수강생
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개의 수강평
수강평 1
∙
평균 평점 5.0
5
1つの概念を説明するときに追加の活用方法までとても慎重に教えてくれるので、一般的に気になる事項のほとんどが講義に含まれていると見れば良いです。 また、es6のメリットを最大限に活用して作成しますので、講義の終わりにはきれいで簡潔なコードの習慣も育てることができます。 フレームワーク経験のない方が聴くのにもとても良い講義です。 次の講義が期待されますㅎㅎ
良い評価を残してくれてありがとう。 :D おめでとうございます、この講義がmadstone devに大いに役立つことを心から願っています! 次の講義も一生懸命準備してアップロードしてお知らせします。 楽しい一日をお過ごしください〜 ありがとうございます^^
수강평 2
∙
평균 평점 5.0
5
私は最近vue.jsを学ぶ過程でsvelteが注目されているという情報を聞きました。それで興味を持って購入をするようになりました。まだ頑張っていませんでしたが、中間の感想を書いているなら、真に誠意を持って講義を準備されたという感じを受けます。設計してくれたカリキュラムを見ると、この講義への愛着と悩みが感じられます。コメント書き込んだ新機能のアップデートもお待ちしております
講義を作ったやりがいを感じる感動的な評価ありがとうございます:) この講義がSIMONS様に多くの役に立ちましたら本当によかったです。 新機能もすばやくアップデートしてお知らせします。 楽しい一日をお過ごしください〜
수강평 81
∙
평균 평점 5.0
5
サンプル講義を聞いて半分受講します^^
良い評価ありがとうございます^^ 他のパーツも気に入ってほしいです! 楽しい一日をお過ごしください〜
他のパーツも完全に好きです! 特にTrelloの例はとても楽しいのでとても聞いています^^
他のパートも気に入って嬉しいです:D Trelloの例も楽しいです、本当に嬉しいですㅜㅠ Svelte.jsがソラヨンのWeb開発に大いに役立つことを心から願っています! さわやかで幸せな週末をお過ごしください〜
楽しく頑張りました。ありがとうございます。講義は本当に最高です! 次の講義も楽しみにしています。 講師も楽しい週末をお過ごしください〜
講義時間が短いですが、頑張ってくれたことを心からお祝いします。 次の講義も早く頑張って準備してお知らせします! ソラヨンも楽しい一週間を過ごしてください^^
수강평 26
∙
평균 평점 4.9
5
私はレビューはうまくいきませんが、一度講義のリーディングスキルがとても出てきました。 どんな講義をしても躊躇なく聞こえそうです。 講義の倍速を1.5に合わせて再生しますが、それでも発音の良いシーンなのか内容がすっぽり入ってきます。 中半くらい聞いてるのに、レビュー残します! 0. 質疑応答をとても細かく説明してください 1.目次と項目の区分が講義内容と確実にマッチングされます 2. 情報伝達方式にフレームがあり、各講義の特定時点ごとに おおよそこのような内容を扱うんだと推測が可能です。 3. よく使われるパターン例を置いて応用することをお勧めします(ユーティリティ関数を書く感じ) 4. 何よりも良いと思う部分は、毎映像序盤に伝える前、後の文脈についての説明を軽く説明してくれますが、このため流れを把握するのはとても良いです。 (時には多少退屈な感覚があるとは思えますが、倍速機能があることに関係ないと思います。私の場合はむしろ全体を把握するのが良かったようです) 5. ゴールが深い概念を誰でも分かりやすく解いて説明します。 6. 各トピックを段階的、詳細、多くの例を挙げて深く取り上げます。 数日間のメリットをまとめて残すほどおすすめです。 何より.. 恵まれた川の分量に感心をしました。
あっ! Truestarさん こんにちは。 '質問& このように長文の素敵ですっきりとした受講評を残してくれて本当に感動的ですㅠㅜ 残り半ば以降、講義がTruestar様に失望を抱かせてくれなかったらと思い、 本当に役に立つことを願っています! では、おやすみなさい、 楽しく幸せな一週間を過ごすことを願っています〜👍 素敵な受講評に感謝します〜😭
私は...私が誤解する可能性のある話を残しましたか?^^; 私はただ私が講義ノートを書くような習慣を持っていたので ボールがたくさん入るという声が短く残って誤解がありましたね。 講義は本当に良いです。 剥離ダメが浮かぶのは私だけそうなのでしょうか.. アップデートも続けていただきありがとうございます。 この講義を作るとか、老後が感じられる講義です。 基礎仕上げて応用編でもよろしくお願いします!
₩53,900
지식공유자님의 다른 강의를 만나보세요!
같은 분야의 다른 강의를 만나보세요!