Inflearn brand logo image
Inflearn brand logo image
Inflearn brand logo image
BEST
Programming

/

Front-end

Svelte.js [Core API] Complete Guide

The best Svelte.js course ever, over 21 hours long!

(4.9) 38 reviews

527 learners

  • heropy
Svelte
Rollup
Sortable

Reviews from Early Learners

What you will learn!

  • Learn the latest Svelte.js Core API from the basics!

  • You can understand the immutability and mutable nature of JavaScript data!

  • Understand asynchrony in JavaScript and learn various asynchronous patterns!

  • Understand the basic structure of Rollup.js and create a real project with additional configuration!

  • You can create a ‘Trello clone app’ with Sortable.js as the core module, sign up for Netlify service, and continuously deploy (CD) your project!

The hottest new JavaScript FE framework,
Fall in love with Svelte.js !

Let's get started!

A simpler example and detailed explanation for beginners,
Various patterns and new syntax of Svelte API for intermediate and above users, etc.
We've put together content that will be helpful to anyone learning Svelte!

To make it easier to understand than the homepage example,
I prepared most of the part examples myself, racking my brain!

Even if you don't take the class right away,
You can get a taste of the basic concepts of Svelte through the preview!
At the end of the preview, we'll also create a simple Todo example.
You will find that it is an easier and more convenient front-end framework than React or Vue.
And be sure to check out the full curriculum!

Last year (2019), version 3, which made Svelte what it is today, was officially released for the first time.
It's a very hot, interesting and attractive framework that's only been around for a year now~
Essential learning!


Key examples!

After learning the Svelte Core API, let's create a clone app for the Trello service!
We'll build a project based on the Rollup bundler and introduce a number of technologies (we'll also learn SCSS).
We've also added a new version that migrates to the latest Snowpack build tools!
We also use Netlify to perform continuous deployment based on GitHub repositories.
Please refer to the curriculum for more details.

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


please refer to this!

After the first few lessons, the sound quality improves.
I changed to a more expensive and better microphone~


Any questions?

If you have any questions during the course, please use the Questions & Answers page.
We will respond as quickly as possible.

If you are concerned about taking the course or have any other questions before taking the course,
Please use the inquiry page before registering for the course .


Svelte documentation.

If you need Korean documentation for Svelte API,
Check out the post 'Svelte.js Complete Guide (Renew)'.
https://heropy.blog/2019/09/29/svelte


announcement!

20 20.10.22
As we near the end of the course preparations, we've added several technologies from the latest Svelte version.
We will update soon!

20 20.11.03
I updated the post with 'Svelte.js Complete Guide (Renew)'.
Watch along with the video lecture.

20 20.11.08
We've added the following parts to this course!
- 7-4 . Key block
- 11-4 . Slot Forwarding
- 18-1 . What is Snowpack?
- 18-2 . Understanding the Installation and Configuration of Svelte Templates Based on Snowpack
- 19-1 . Copying the main directory and applying HMR
- 19-2 . Installing and Configuring Core Modules
- 19-3 . Configuring SCSS and Svelte Preprocess
- 19-4 . Configuring log removal in product mode
- 19-5 . Code optimization (minimization) and path alias configuration
- 19-6 . Creating a GitHub repository and pushing the project
- 19-7 Continuous Deployment with Netlify

20 20.12.24
We've added the following parts to this course!
Be sure to watch this before starting the 'Building a Trello Clone App' tutorial example!
- 15-1 . Matching the lecture example module version

20 20.12.30
We've added the following parts to this course!
- 11-5 . $$slots

Svelte.js, Frontend, Framework, Core API, Sortable,js, Rollup.js, React, Vue.js, Angular

Recommended for
these people

Who is this course right for?

  • Experience the new cutting-edge web front-end framework!

  • For those who lack front-end development experience!

  • Those who find the official Svelte.js documentation difficult to learn or do not understand certain parts!

  • People who don't mind a lot of explanations!

Need to know before starting?

  • HTML

  • CSS

  • JS

Hello
This is

4,183

Learners

220

Reviews

162

Answers

4.9

Rating

3

Courses

   

안녕하세요~ 반갑습니다!
저는 현재 작은 스타트업에서 기업 관리 솔루션을 개발하고 있는 프론트엔드 개발자 박영웅입니다.

HEROPY 기술 블로그를 운영하고 있고,
그 외 기업 출강이나 온/오프라인 강의 활동도 하고 있습니다.

Blog: https://heropy.blog
Youtube: https://www.youtube.com/channel/UCcjhMpoaNvyy0StN9KgtF6w

Email: thesecon@gmail.com

    

Curriculum

All

116 lectures ∙ (21hr 18min)

Published: 
Last updated: 

Reviews

All

38 reviews

4.9

38 reviews

  • hanbin85705100님의 프로필 이미지
    hanbin85705100

    Reviews 1

    Average Rating 5.0

    5

    99% enrolled

    1つの概念を説明するときに追加の活用方法までとても慎重に教えてくれるので、一般的に気になる事項のほとんどが講義に含まれていると見れば良いです。 また、es6のメリットを最大限に活用して作成しますので、講義の終わりにはきれいで簡潔なコードの習慣も育てることができます。 フレームワーク経験のない方が聴くのにもとても良い講義です。 次の講義が期待されますㅎㅎ

    • heropy
      Instructor

      良い評価を残してくれてありがとう。 :D おめでとうございます、この講義がmadstone devに大いに役立つことを心から願っています! 次の講義も一生懸命準備してアップロードしてお知らせします。 楽しい一日をお過ごしください〜 ありがとうございます^^

  • simongs님의 프로필 이미지
    simongs

    Reviews 2

    Average Rating 5.0

    5

    28% enrolled

    私は最近vue.jsを学ぶ過程でsvelteが注目されているという情報を聞きました。それで興味を持って購入をするようになりました。まだ頑張っていませんでしたが、中間の感想を書いているなら、真に誠意を持って講義を準備されたという感じを受けます。設計してくれたカリキュラムを見ると、この講義への愛着と悩みが感じられます。コメント書き込んだ新機能のアップデートもお待ちしております

    • heropy
      Instructor

      講義を作ったやりがいを感じる感動的な評価ありがとうございます:) この講義がSIMONS様に多くの役に立ちましたら本当によかったです。 新機能もすばやくアップデートしてお知らせします。 楽しい一日をお過ごしください〜

  • sorayeon님의 프로필 이미지
    sorayeon

    Reviews 81

    Average Rating 5.0

    5

    98% enrolled

    サンプル講義を聞いて半分受講します^^

    • heropy
      Instructor

      良い評価ありがとうございます^^ 他のパーツも気に入ってほしいです! 楽しい一日をお過ごしください〜

    • 他のパーツも完全に好きです! 特にTrelloの例はとても楽しいのでとても聞いています^^

    • heropy
      Instructor

      他のパートも気に入って嬉しいです:D Trelloの例も楽しいです、本当に嬉しいですㅜㅠ Svelte.jsがソラヨンのWeb開発に大いに役立つことを心から願っています! さわやかで幸せな週末をお過ごしください〜

    • 楽しく頑張りました。ありがとうございます。講義は本当に最高です! 次の講義も楽しみにしています。 講師も楽しい週末をお過ごしください〜

    • heropy
      Instructor

      講義時間が短いですが、頑張ってくれたことを心からお祝いします。 次の講義も早く頑張って準備してお知らせします! ソラヨンも楽しい一週間を過ごしてください^^

  • hanmg님의 프로필 이미지
    hanmg

    Reviews 10

    Average Rating 4.9

    5

    91% enrolled

    親切に教えてくれて楽しくSvelte + @(用語、scssなど)を学ぶことができました。

    • heropy
      Instructor

      私の講義が役立つことを心から願っています〜 ありがとう。👍

  • truestar님의 프로필 이미지
    truestar

    Reviews 26

    Average Rating 4.9

    5

    100% enrolled

    私はレビューはうまくいきませんが、一度講義のリーディングスキルがとても出てきました。 どんな講義をしても躊躇なく聞こえそうです。 講義の倍速を1.5に合わせて再生しますが、それでも発音の良いシーンなのか内容がすっぽり入ってきます。 中半くらい聞いてるのに、レビュー残します! 0. 質疑応答をとても細かく説明してください 1.目次と項目の区分が講義内容と確実にマッチングされます 2. 情報伝達方式にフレームがあり、各講義の特定時点ごとに おおよそこのような内容を扱うんだと推測が可能です。 3. よく使われるパターン例を置いて応用することをお勧めします(ユーティリティ関数を書く感じ) 4. 何よりも良いと思う部分は、毎映像序盤に伝える前、後の文脈についての説明を軽く説明してくれますが、このため流れを把握するのはとても良いです。 (時には多少退屈な感覚があるとは思えますが、倍速機能があることに関係ないと思います。私の場合はむしろ全体を把握するのが良かったようです) 5. ゴールが深い概念を誰でも分かりやすく解いて説明します。 6. 各トピックを段階的、詳細、多くの例を挙げて深く取り上げます。 数日間のメリットをまとめて残すほどおすすめです。 何より.. 恵まれた川の分量に感心をしました。

    • heropy
      Instructor

      あっ! Truestarさん こんにちは。 '質問& このように長文の素敵ですっきりとした受講評を残してくれて本当に感動的ですㅠㅜ 残り半ば以降、講義がTruestar様に失望を抱かせてくれなかったらと思い、 本当に役に立つことを願っています! では、おやすみなさい、 楽しく幸せな一週間を過ごすことを願っています〜👍 素敵な受講評に感謝します〜😭

    • 私は...私が誤解する可能性のある話を残しましたか?^^; 私はただ私が講義ノートを書くような習慣を持っていたので ボールがたくさん入るという声が短く残って誤解がありましたね。 講義は本当に良いです。 剥離ダメが浮かぶのは私だけそうなのでしょうか.. アップデートも続けていただきありがとうございます。 この講義を作るとか、老後が感じられる講義です。 基礎仕上げて応用編でもよろしくお願いします!

$41.80

heropy's other courses

Check out other courses by the instructor!

Similar courses

Explore other courses in the same field!