강의

멘토링

로드맵

Inflearn brand logo image
Programming

/

Front-end

作りながら学ぶSvelte

最新のフロントエンドフレームワークSvelte(スベルト)を学ぶ講座です。 Svelteの基本的な使い方を習得した後、Todoアプリを一緒に作成しながら、実際のプロジェクトでどのようにSvelteを使用できるかを学ぶコースです。

  • Indie Coder
Svelte

学習した受講者のレビュー

こんなことが学べます

  • Svelteの基本的な使い方

  • Svelteを使ってTodoアプリを作成しながら実際の使い方を学ぶ

  • 開発した Todo アプリを Store を通じてシルプロジェクトに近づけるリファクタリング

  • Routifyを使用したRouter機能

  • Fetch、Axiosを用いたAjax通信方法

  • ES6配列メソッドの使用方法

JSフロントエンドフレームワークのニューフェイス、 Svelteに会いましょう。

トピック紹介📝

2019年に入って最もホットに関心が高まったフロントエンドフレームワークSvelte(スベルト)を学んでみる講座です。

なぜ学ばなければならないのか✒️

▲ Svelte ロゴ

現在、React、Vue.jsなど、さまざまなフロントエンドフレームワークがあります。各フレームワークは異なる哲学と方法論を持っています。
Svelteは、より少ないコードで完璧なリアリティの実装を代表的な特徴として掲げるフレームワークです。

次のコードは、Stateを異なるフレームワークで実装した例です。見てみると、コード量の明確な違いがわかります。

▲他のフレームワークに比べてコード量が断然少ないSvelte

実際、各フレームワークは異なりますが、すべて同じような概念を持っていることもあります。もしフロントエンドが初めてなら、現在出てきたフレームワークの中で最も習得しやすいので、 Svelteを先に覚えてから、他のフレームワークを習うのにも多くの役に立つと思われます。

そして、すでに他のフレームワークをすでに使っている方であれば、Svelteを学ぶのはそれほど難しくないでしょう。

セクションごとに簡単な紹介📖

  • 0~4強:Svelte基礎
  • レッスン5:Svelteを使用したTo-doサービスの開発
  • レッスン6:To-doサービスをStoreでリファクタリング
  • レッスン7:ルーターの適用
  • 強さ8: Ajax処理
  • 10講義:講義に必要な簡単なJavascriptその他の文法

講義結果🧰

私たちが最終的にするアプリの姿です。単純なTodoアプリですが、ここで学んだパターンを拡張すれば、実際のプロジェクトでも使用できます

▲Svelteで作成したTo-Doアプリ

レッスンソース&教材💡

こんな方に
おすすめです

学習対象は
誰でしょう?

  • フロントエンドの開発に興味がある方

  • 既存のフロントエンド開発者

  • デザイナーやパブリッシャーでフロントエンドに挑戦したい人

  • より簡単なフロントエンドフレームワークをお探しの方

前提知識、
必要でしょうか?

  • HTMLの基礎

  • Javascriptの基本

  • CSSの基礎

こんにちは
です。

2,417

受講生

56

受講レビュー

84

回答

4.8

講座評価

5

講座

2000년도 중반부터 본격적으로 웹개발을 시작하여 현재까지 프리랜서 개발자로 활동하고 있습니다. 약5년간 Amplix BI 솔루션 실무자 교육을 진행하고 개발을 지원하며 새로운 기술을 효율적으로 전달하는 것에 대한 많은 경험과 고민을 했습니다. 

현재는 개발 업무와 함께 개발자들에게 도움이 될만한 웹관련 분야의 새로운 기술을 찾고 강좌와 책을 통해 공유하고 있습니다. 

 

현) 프리랜서

전) (주) 비즈플러그 전략솔루션 사업부 팀장

전) (주) 퍼니몽키스 위니스토리 서비스 개발 팀장

youtube: https://www.youtube.com/channel/UC3cJspjF4TRTyD_RS0azeaw 

email: freeseamew@gmail.com

blog1: https://medium.com/freeseamew

blog2: https://dev.to/freeseamew

 

강좌 목록

출간도서

yes24, 교보문고, 알라딘

 

 

 

カリキュラム

全体

39件 ∙ (5時間 7分)

講座資料(こうぎしりょう):

授業資料
講座掲載日: 
最終更新日: 

受講レビュー

全体

9件

4.9

9件の受講レビュー

  • 최광성님의 프로필 이미지
    최광성

    受講レビュー 6

    平均評価 5.0

    5

    87% 受講後に作成

    강사님이 이 강의를 만든 이유는 확실합니다. svelte가 너무나 강력하고 좋기 때문입니다. svelte를 실제 프로젝트에 사용해보겠습니다.

    • Indie Coder
      知識共有者

      앗 첫 수강평 감사합니다. 그리고 svelte에 대해서도 좋은 느낌이셨다니 다행이네요 ㅎ 앞으로도 좋은 코딩 하시길 바래요. ^^

  • 스터디하쟈님의 프로필 이미지
    스터디하쟈

    受講レビュー 22

    平均評価 3.4

    5

    77% 受講後に作成

    입문할때, 필요한 핵심 내용들을 잘 알려주셔서 감사합니다. 아직은 배우는 단계이지만, 강의 들을때 궁금했던 것들을 자세히 알려주셔서 도움이 됐습니다. 다음 강의 기대 하겠습니다. ^^

    • Indie Coder
      知識共有者

      강의가 만족스러웠다니 다행입니다. 앞으로도 계속 좋은 강의 준비해 보겠습니다. ^^

  • heeleeya님의 프로필 이미지
    heeleeya

    受講レビュー 3

    平均評価 5.0

    5

    54% 受講後に作成

    많이 좋아요~~~~!

    • 나만죽을순없지님의 프로필 이미지
      나만죽을순없지

      受講レビュー 5

      平均評価 5.0

      5

      74% 受講後に作成

      스벨트가 너무 관심이 생겼지만 아직 자료가 많지않아 힘들었는데 가려운 부분을 시원하게 긁어주셨던 강의였습니다. 입문자에게 성취감과 좋은 강의 다시한번 감사해요

      • Indie Coder
        知識共有者

        강좌가 맘에 드셨다니 다행입니다. 현재 svelte + rest api 관련 강좌가 무료로 배포될 예정입니다. 해당 강좌도 이어서 학습하시면 도움이 되실 것 같습니다. 앞으로도 계속해서 좋은 강좌를 만들기 위해 노력하겠습니다. 감사합니다.

    • 좋은사람님의 프로필 이미지
      좋은사람

      受講レビュー 5

      平均評価 4.2

      4

      100% 受講後に作成

      주석을 한줄도 안다시데 주석 좀 달면서 강의하셔야 한다고 봅니다.

      • Indie Coder
        知識共有者

        넵 참고하겠습니다. 혹시 어떤 스타일로 주석이 추가되었으면 좋은지 의견부탁드립니다. 보내주신 의견은 최대한 반영하도록 노력해보겠습니다. 감사합니다.

    ¥4,016

    Indie Coderの他の講座

    知識共有者の他の講座を見てみましょう!

    似ている講座

    同じ分野の他の講座を見てみましょう!