Svelte REST-API 프로젝트
Indie Coder
이 강의는 제가 집필한 ‘스벨트로 시작하는 웹 프런트엔드’ 라는 책의 후반부 SLOG 프로젝트 만들기 부분에 대한 영상 강의입니다. 책에서 조금 부족했던 부분들을 보완해, 좀 더 많은 분들이 Svelte라는 프런트엔드 프레임워크에 대해 관심을 갖길 바라는 마음에서 이 강의를 마련했습니다.
초급
Svelte, REST API
만들면서 배우는 Svelte
최신 프론트엔드 프레임워크 Svelte(스벨트)를 배워보는 강좌입니다. Svelte 기본 사용법을 익힌 후 Todo 앱을 함께 만들면서 실제 프로젝트에서 어떻게 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 앱
수업 소스 & 교재 💡
- Todo 리팩토링 + Routift + Ajax
https://github.com/freeseamew/todo-svelte-store
- 만들면서 배우는 Svelte (e-Book 교재) - todo실습 노트는 교육사이트에서 수강자만 다운가능합니다.
https://freeseamew.gitbook.io/svelte/
이런 분들께
추천드려요!
학습 대상은
누구일까요?
프론트엔드 개발에 관심이 있으신 분
기존 프론트엔드 개발자분
디자이너 또는 퍼블리셔에서 프론트엔드에 도전해보고 싶으신 분
보다 쉬운 프론트엔드 프레임워크를 찾고 계신 분
선수 지식,
필요할까요?
HTML 기초
Javascript 기초
CSS 기초
안녕하세요
Indie Coder입니다.
2,354
명
수강생
50
개
수강평
83
개
답변
4.9
점
강의 평점
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
강좌 목록
출간도서
커리큘럼
전체
39개 ∙ (5시간 7분)
해당 강의에서 제공:
수업자료
1. svelte 소개
03:00
2. 소스&교재
00:41
3. 개발 환경 세팅
01:47
4. svelte 설치
03:51
5. svelte 앱 기본 구조
04:47
6. 컴포넌트 기본 - 레이아웃
07:50
7. state
05:45
8. reactivity
11:29
강의 게시일:
마지막 업데이트일:
수강평
전체
9개
4.9
9개의 수강평
- 나만죽을순없지
수강평 5
∙
평균 평점 5.0
5
74% 수강 후 작성스벨트가 너무 관심이 생겼지만 아직 자료가 많지않아 힘들었는데 가려운 부분을 시원하게 긁어주셨던 강의였습니다. 입문자에게 성취감과 좋은 강의 다시한번 감사해요
- Indie Coder지식공유자
강좌가 맘에 드셨다니 다행입니다. 현재 svelte + rest api 관련 강좌가 무료로 배포될 예정입니다. 해당 강좌도 이어서 학습하시면 도움이 되실 것 같습니다. 앞으로도 계속해서 좋은 강좌를 만들기 위해 노력하겠습니다. 감사합니다.
- 스터디하쟈
수강평 22
∙
평균 평점 3.4
5
77% 수강 후 작성입문할때, 필요한 핵심 내용들을 잘 알려주셔서 감사합니다. 아직은 배우는 단계이지만, 강의 들을때 궁금했던 것들을 자세히 알려주셔서 도움이 됐습니다. 다음 강의 기대 하겠습니다. ^^
- Indie Coder지식공유자
강의가 만족스러웠다니 다행입니다. 앞으로도 계속 좋은 강의 준비해 보겠습니다. ^^
heeleeya수강평 3
∙
평균 평점 5.0
- 좋은사람
수강평 5
∙
평균 평점 4.2
4
100% 수강 후 작성주석을 한줄도 안다시데 주석 좀 달면서 강의하셔야 한다고 봅니다.
- Indie Coder지식공유자
넵 참고하겠습니다. 혹시 어떤 스타일로 주석이 추가되었으면 좋은지 의견부탁드립니다. 보내주신 의견은 최대한 반영하도록 노력해보겠습니다. 감사합니다.
- 최광성
수강평 6
∙
평균 평점 5.0
5
87% 수강 후 작성강사님이 이 강의를 만든 이유는 확실합니다. svelte가 너무나 강력하고 좋기 때문입니다. svelte를 실제 프로젝트에 사용해보겠습니다.
- Indie Coder지식공유자
앗 첫 수강평 감사합니다. 그리고 svelte에 대해서도 좋은 느낌이셨다니 다행이네요 ㅎ 앞으로도 좋은 코딩 하시길 바래요. ^^
Indie Coder님의 다른 강의
지식공유자님의 다른 강의를 만나보세요!
![GraphQL 완전정복 (키오스크를 만들며 배우는 풀스택 과정) - [2024 부분 리뉴얼]강의 썸네일](https://cdn.inflearn.com/public/courses/329186/cover/a63c6c95-2318-4e7a-a4f0-34d4512b3ae6/329186-eng.png?w=420)
비슷한 강의
같은 분야의 다른 강의를 만나보세요!
