강의

멘토링

로드맵

BEST
Programming

/

Front-end

Svelte.js SPA movie search project

We're building and deploying a Svelte-based SPA movie search site!

(5.0) 30 reviews

371 learners

  • HEROPY
Svelte
SPA

Reviews from Early Learners

What you will learn!

  • You can build a SPA (Single Page Application) with Svelte.js!

  • You can utilize the advantages of SPA and compensate for its disadvantages!

  • You can easily configure a backend API using Serverless Functions!

Using Svelte , here's an example of creating your own SPA !

Check out other Svelte courses too!
"The Complete Guide to Svelte.js Core API"
"Svelte.js Beginner's Guide"


Let's get started!

Let's create a SPA (Single Page Application) example using Svelte.js!
You can use routers to separate pages and apply various features such as transition effects and scroll recovery.

Using SF (serverless function) without the burden of building a separate server,
Quickly create backend APIs and easily manage them.
Solve security issues, a drawback of SPA, quickly and easily!

Snowpack is the most up-to-date build tool,
It can drastically reduce development build times.
You can develop in a more comfortable environment!

Use Netlify's continuous delivery (CD).
As soon as you upload to the GitHub repository, the site will be automatically deployed.
No need to waste time deploying your site!


please refer to this!

This lecture requires prior knowledge, but I will explain it as simply as possible.
After building a solid foundation in Svelte with the previously released ' Svelte.js Core API Complete Guide ',
It would be even better if you listen to this lecture.


Let's create a SPA site that can search for real movies using the OMDb API!
Configure your backend API with Netlify Serverless Functions,
You can provide search functionality to your users without exposing your API key.

GitHub Repo: https://github.com/HeropCode/Svelte-Movie-app
Demo: https://competent-cori-258206.netlify.app


Specs

Svelte
Snowpack
SPA Router
OMDb API
Netlify Hosting with GitHub (CD)
Netlify Serverless Functions


Packages

snowpack
@snowpack/plugin-svelte
@snowpack/plugin-dotenv
@snowpack/plugin-sass
@snowpack/plugin-optimize
@snowpack/plugin-babel
babel-plugin-transform-remove-console
svelte
svelte-spa-router
autoprefixer
postcss
lodash
axios
qs
netlify-cli


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.12.24
Added the next part!
Be sure to watch the full lecture examples before you start!
- 2-1. Matching the lecture example module version

Recommended for
these people

Who is this course right for?

  • Anyone who needs examples of using Svelte.js!

  • For those preparing to create a SPA site!

  • Anyone who wants to experience Netlify Serverless Functions!

Need to know before starting?

  • HTML

  • CSS(SCSS)

  • JS

  • Svelte

Hello
This is

4,189

Learners

221

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

49 lectures ∙ (7hr 46min)

Published: 
Last updated: 

Reviews

All

30 reviews

5.0

30 reviews

  • shk72301233님의 프로필 이미지
    shk72301233

    Reviews 7

    Average Rating 5.0

    5

    100% enrolled

    I completed the movie search project using Svelte :) Actually, I bought this course and watched only the beginning part, but it's been quite a while since I've been preparing to study front-end development in earnest after quitting my job, so I looked it up again. I first got to know the instructor through the YouTube Svelte course, and the explanations were simple and clear, and I guess... since he was a designer, he was really excellent at making it so that anyone could understand even if they had little basic knowledge, as long as they followed the explanations. I compared this course with the movie search site example made with Vue.js in the Fast Campus Super Gap package, and I could see that the amount of code was greatly reduced, and since the complex store concept of Vue was completely eliminated, I think I could grasp the big picture of the project design more clearly. And Svelte seems to be a framework that is developing rapidly day by day. Daum's home screen is already using Svelte, so I think it's more promising in the future because it has no shortcomings that can be used in practice. There are still a lot of react and vue, but I see the word svelte coming out little by little in the job market. ㅎㅎ If you want to become a front-end developer in the future, I highly recommend not only this lecture, but also instructor Park Young-woong's svelte introduction and complete guide lectures :D Thank you.

    • mysend님의 프로필 이미지
      mysend

      Reviews 4

      Average Rating 5.0

      5

      100% enrolled

      I was very interested in the front end, and the progression was so clean that it stuck in my head, and above all, I enjoyed it!

      • heropy
        Instructor

        Thank you for liking my lecture~ I'm glad you enjoyed it. I hope the lecture was helpful~ Thank you.😉

    • mdhyunjin님의 프로필 이미지
      mdhyunjin

      Reviews 4

      Average Rating 5.0

      5

      100% enrolled

      I learned a lot from the wealth of information that was actually helpful.

      • heropy
        Instructor

        I'm glad my lecture was helpful! Thank you so much for your kind words. Have a nice week~😊

    • hanmg님의 프로필 이미지
      hanmg

      Reviews 10

      Average Rating 4.9

      5

      100% enrolled

      Thank you for the great lecture. I was able to get a lot of information about not only svelte but also netlify, which is necessary for practical deployment.

      • heropy
        Instructor

        I'm glad that my lecture was helpful to HAN_MG. I hope I can come back with a better lecture~😆 Thank you.

    • the27920609님의 프로필 이미지
      the27920609

      Reviews 13

      Average Rating 5.0

      5

      100% enrolled

      It's the best. It's a very clean lecture structure.

      • heropy
        Instructor

        Hi Jon~ Thank you for the wonderful and encouraging class review~👍 Have a nice day!🍀

    Limited time deal

    $25.30

    23%

    $33.00

    HEROPY's other courses

    Check out other courses by the instructor!

    Similar courses

    Explore other courses in the same field!