만들면서 배우는 Svelte

Name: 만들면서 배우는 Svelte
Price: 33000 KRW

최신 프론트엔드 프레임워크 Svelte(스벨트)를 배워보는 강좌입니다. Svelte 기본 사용법을 익힌 후 Todo 앱을 함께 만들면서 실제 프로젝트에서 어떻게 Svelte를 사용할 수 있는지 익혀보는 강좌입니다.

(4.9) 수강평 9개

수강생 112명

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강: Router 적용
8강: Ajax 처리
10강: 강의에 필요한 간단한 Javascript 기타 문법

강의 결과물 🧰

저희가 최종적으로 만들게 되는 앱의 모습입니다. 단순한 Todo앱이지만, 여기서 배운 패턴들을 확장하시면, 실제 프로젝트에서도 사용이 가능할 것입니다.

^{▲ Svelte로 만든 To-Do 앱}

수업 소스 & 교재 💡

2-4강까지의 예제
https://github.com/freeseamew/svelte-tutoral-basic-example

Todo 기본 예제
https://github.com/freeseamew/todo-svelte-basic

Todo 리팩토링 + Routift + Ajax
https://github.com/freeseamew/todo-svelte-store

만들면서 배우는 Svelte (e-Book 교재) - todo실습 노트는 교육사이트에서 수강자만 다운가능합니다.
https://freeseamew.gitbook.io/svelte/

이런 분들께
추천드려요

학습 대상은
누구일까요?

프론트엔드 개발에 관심이 있으신 분
기존 프론트엔드 개발자분
디자이너 또는 퍼블리셔에서 프론트엔드에 도전해보고 싶으신 분
보다 쉬운 프론트엔드 프레임워크를 찾고 계신 분

선수 지식,
필요할까요?

HTML 기초
Javascript 기초
CSS 기초

안녕하세요
입니다.

2,451

명

수강생

개

수강평

개

답변

4.8

점

강의 평점

개

강의

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분)

해당 강의에서 제공:

수업자료

섹션 1. svelte 소개

1개 ∙ (3분)

1. svelte 소개
03:00

섹션 2. 개발환경 설정

3개 ∙ (6분)

섹션 3. 컴포넌트 기본

8개 ∙ (54분)

5. svelte 앱 기본 구조
04:47
6. 컴포넌트 기본 - 레이아웃
07:50
7. state
05:45
8. reactivity
11:29
9. 컴포넌트 통신방법 1 - props
07:00
10. 컴포넌트 통신방법 2 - dispatch
06:40
11. 컴포넌트 통신방법 3 - context API
05:52
12. 컴포넌트 통신방법 4 - store
05:16

섹션 4. 컴포넌트 - 템플릿 제어

6개 ∙ (46분)

섹션 5. 스타일 및 효과

2개 ∙ (12분)

섹션 6. 실습 1 - todo 만들기

8개 ∙ (1시간 12분)

섹션 7. 실습2 - store를 통한 todo 서비스 리팩토링

4개 ∙ (56분)

섹션 8. 라우터 - routify

2개 ∙ (26분)

섹션 9. 실습3 - ajax 통신 연동

2개 ∙ (19분)

섹션 10. 마무리

1개 ∙ (0분)

섹션 11. 기타

2개 ∙ (9분)

강의 게시일:

마지막 업데이트일:

수강평

전체

9개

4.9

9개의 수강평

kwangsung
수강평 6
∙
평균 평점 5.0
5
87% 수강 후 작성
The reason why the instructor created this course is clear. Svelte is so powerful and good. Let's use Svelte in real projects.
- holocoding
  지식공유자
  Oh, thank you for your first class review. And I'm glad you felt good about Svelte. ㅎ I hope you continue to code well in the future. ^^
predyum
수강평 22
∙
평균 평점 3.4
5
77% 수강 후 작성
When I first started, thank you for giving me the essential information I needed. I'm still learning, but it was helpful that you explained in detail the things I was curious about while listening to the lecture. I look forward to the next lecture. ^^
- holocoding
  지식공유자
  I'm glad you were satisfied with the lecture. I will continue to prepare good lectures in the future. ^^
shclals840573
수강평 3
∙
평균 평점 5.0
5
54% 수강 후 작성
I like it a lot~~~~!
todaypan2020
수강평 5
∙
평균 평점 5.0
5
74% 수강 후 작성
I was really interested in Svelt, but I had a hard time because there wasn't much material yet. This was a lecture that scratched my itchy part. Thank you again for the great lecture and sense of accomplishment for beginners.
- holocoding
  지식공유자
  I'm glad you liked the course. Currently, the svelte + rest api related course is scheduled to be distributed for free. I think it will be helpful if you continue studying the course. I will continue to work hard to create good courses in the future. Thank you.
oeo
수강평 5
∙
평균 평점 4.2
4
100% 수강 후 작성
I think you should lecture while adding some comments since you don't know how to comment at all.
- holocoding
  지식공유자
  Yes, I will take note of it. Please let me know what style of commentary you would like added. I will try my best to reflect the opinions you sent me. Thank you.

₩33,000

Indie Coder님의 다른 강의

지식공유자님의 다른 강의를 만나보세요!

Next-Generation Node.js Backend Server Development (with Fastify & Prisma & Typescript)

Indie Coder

A course to learn the latest Node.js backend REST API using fastify, a Node.js framework boasting high speed, ORM Prisma, and Typescript.

Basic

Node.js, TypeScript, Prisma

Next-Generation Node.js Backend Server Development (with Fastify & Prisma & Typescript)

Indie Coder

Svelte REST-API project

Indie Coder

This lecture is a video lecture on the latter part of the book, ‘Web Frontend with Svelte’, which I wrote, about creating a SLOG project. I prepared this lecture in the hope that it would supplement the parts that were a bit lacking in the book and make more people interested in the frontend framework called Svelte.

Basic

Svelte, REST API

Svelte REST-API project

Indie Coder

Web frontend starting with Svelte

Indie Coder

This is a basic lecture that summarizes the core usage methods of Svelte, a front-end framework that is gaining attention worldwide. I created this lecture in the hope that more people in Korea can use Svelte easily and conveniently.

Basic

Svelte

Web frontend starting with Svelte

Indie Coder

Complete Mastery of GraphQL (Full-stack Course Learning by Building a Kiosk) - [2024 Partial Renewal]

Indie Coder

You will learn the basics and advanced usage of GraphQL, the next-generation API control technology, and gain real-world project experience through a virtual kiosk service created with GraphQL. The course has been partially updated to the latest version, apollo-server v4, as of February 2024.

Basic

GraphQL, Svelte, MongoDB

Complete Mastery of GraphQL (Full-stack Course Learning by Building a Kiosk) - [2024 Partial Renewal]

Indie Coder

비슷한 강의

같은 분야의 다른 강의를 만나보세요!

Learn Svelte (SvelteKit + Supabase) easily with projects

Michael Kwon

Systematic step-by-step project practice and deployment, built-in store utilization, full-stack application with SvelteKit and Supabase, all in one go!

Basic

Svelte, sveltekit, supabase

Learn Svelte (SvelteKit + Supabase) easily with projects

Michael Kwon

Svelte REST-API project

Indie Coder

Basic

Svelte, REST API

Svelte REST-API project

Indie Coder

Web frontend starting with Svelte

Indie Coder

Basic

Svelte

Web frontend starting with Svelte

Indie Coder

Complete Mastery of GraphQL (Full-stack Course Learning by Building a Kiosk) - [2024 Partial Renewal]

Indie Coder

Basic

GraphQL, Svelte, MongoDB

Complete Mastery of GraphQL (Full-stack Course Learning by Building a Kiosk) - [2024 Partial Renewal]

Indie Coder

Svelte Practical Tutorial - Creating Sudoku

beomy

You can create a web game using Svelte, Express, JWT, and MongoDB. Those who want to cover both the FrontEnd and BackEnd are welcome!

Intermediate

Svelte, Express, MongoDB

Svelte Practical Tutorial - Creating Sudoku

beomy

만들면서 배우는 Svelte

먼저 경험한 수강생들의 후기

이런 걸 배울 수 있어요

주제 소개 📝

왜 배워야 하는지 ✒️

섹션마다 간단한 소개 📖

강의 결과물 🧰

수업 소스 & 교재 💡

이런 분들께 추천드려요

안녕하세요 .css-1q3zd4q{text-decoration-line:underline;text-underline-position:under;text-underline-offset:1px;}입니다.

강좌 목록

출간도서

커리큘럼

수강평

Indie Coder님의 다른 강의

비슷한 강의

이런 분들께
추천드려요

안녕하세요
입니다.