Svelte with Test Driven Development from Udemy

The frontend world is having very popular frameworks which are heavily used in most of the applications. Svelte is joining this competition by bringing lots of cool, developer friendly features. After practicing svelte, it will be hard to go back and work with other frameworks. You will be amazed when you see how much you can do with less code.

In this course we will be learning Svelte by creating a web application with it. Also we will apply test driven development (TDD) methodology from beginning to the end.

We will use one of the most popular test libraries of javascript. jest and testing-library

while building this application, we will learn

client-side routing. we will apply our custom implementation then we will use svelte-routing library
internationalization
global state management in a component based application

and we will see

how test driven development works.
how it's affecting our code quality, reusability
how it's giving us the confidence about refactoring our implementation
how to avoid implementation details while creating tests

This course is purely built on practice. Each code piece we write, will be for our actual application implementation.

In each section we will gradually build our application. We will not jump ahead and add functionality not needed for that moment. We will implement one requirement at a time. Each implementation will bring the next requirement to us.

And following this practice, will help you to get a solid foundation about overall web application requirements and how to implement one of them with Svelte by following test driven development methodology.

After completing the course, you will be able to use Svelte in your next project and you will experience the benefits of test driven development.

What's inside

Learning objectives

Build application with svelte 3
Build an application with internationalization (i18n)
Build an application with client side routing
Store, actions, reactive declarations and many more features of svelte

Practice test driven development in a complete project from beginning to the end.
Learn the test runner, jest and understand how to structure test modules
How to mock external dependencies in testing.
Feel how the test driven development is giving confidence when refactoring your application.

Build application with svelte 3
Build an application with internationalization (i18n)
Build an application with client side routing
Store, actions, reactive declarations and many more features of svelte
Practice test driven development in a complete project from beginning to the end.
Learn the test runner, jest and understand how to structure test modules
How to mock external dependencies in testing.
Feel how the test driven development is giving confidence when refactoring your application.

Syllabus

Introduction

Methodology

Create Project

Running the App

If you see an issue with npm install for backend.zip you can try backend-without-db.zip which requires minimal dependencies.

Traffic lights

Read about what's good

what should give you pause

and possible dealbreakers

Examines popular frameworks used in most frontend applications, such as Svelte, highlighting its developer-friendly features and potential benefits

Develops practical skills in building a web application with Svelte from start to finish, emphasizing test-driven development (TDD)

Emphasizes internationalization (i18n) techniques, allowing learners to create multilingual applications that cater to users from diverse backgrounds

Introduces client-side routing, enabling learners to create applications with dynamic page navigation and single-page app (SPA) functionality

Utilises Jest and testing-library, popular JavaScript testing frameworks, to demonstrate the principles and benefits of TDD throughout the course

Provides practical experience in managing global state within a component-based application, ensuring data consistency and efficient state handling

Reviews summary

Svelte and tdd: a practical project guide

According to students, 'Svelte with Test Driven Development' offers a highly practical and project-based approach to learning Svelte 3 alongside TDD. Learners consistently praise its step-by-step methodology which builds a complete web application, making concepts like client-side routing, internationalization, and global state management tangible. The course is particularly strong in demonstrating effective Test Driven Development practices, using Jest and Testing Library, and fostering confidence in refactoring code. While it provides a solid foundation for Svelte, some learners suggest having prior JavaScript knowledge, as the pace can be quick at times, and occasional dependency updates might be needed.

Covers essential Svelte features for practical application.

"I now have a solid foundation in Svelte 3 features like client-side routing, i18n, and state management."

"The course effectively introduced core Svelte concepts through real-world examples, which was very beneficial."

"I appreciate how it covers the most important aspects of Svelte development without getting bogged down."

Successfully integrates Test Driven Development into the workflow.

"The TDD approach was consistently applied throughout, providing a solid understanding of its benefits and how to use it effectively."

"I now feel confident applying TDD in my own projects, thanks to the practical demonstrations and clear examples."

"It clearly showed how TDD improves code quality and gives you confidence when refactoring your application."

Builds a complete application step-by-step, reinforcing concepts.

"The course's emphasis on building a full application was extremely helpful; it made learning Svelte and TDD very tangible."

"I found the practical, step-by-step approach made grasping Svelte and TDD concepts much easier."

"It’s purely built on practice, which is exactly what I needed to solidify my understanding of a real-world application."

Some encountered issues with outdated dependencies, requiring minor adjustments.

"I encountered some issues with 'npm install' due to slightly outdated dependencies, but they were resolvable."

"Had to troubleshoot a few package version conflicts, but the core content remains highly valuable."

"It would be great if the course material could be periodically updated with the latest library versions to avoid small hurdles."

May require prior JavaScript/frontend experience for optimal learning.

"While comprehensive, the pace was sometimes fast, especially for those new to TDD or with limited JavaScript background."

"I recommend having some fundamental JavaScript knowledge before diving into this course to get the most out of it."

"A few sections felt a bit rushed, requiring me to pause and re-watch to fully grasp the material."

Activities

Be better prepared before your course. Deepen your understanding during and after it. Supplement your coursework and achieve mastery of the topics covered in Svelte with Test Driven Development with these activities:

Review CSS Fundamentals

Show steps

Ensure a solid foundation in CSS to effectively style your Svelte applications.

Browse courses on CSS

Show steps

Review core CSS concepts
Practice writing CSS rules

Tutor a Beginner in Svelte

Show steps

Reinforce your knowledge by guiding a beginner through their Svelte journey.

Show steps

Find a beginner who needs help with Svelte
Provide one-on-one support and guidance
Share resources and best practices

Explore the Svelte Kitchen Sink

Show steps

Gain hands-on experience with Svelte by following guided tutorials and experimenting with the Kitchen Sink.

Show steps

Start the Svelte Kitchen Sink
Explore the component gallery
Try out different Svelte features

Four other activities

Expand to see all activities and additional details

Show all seven activities

Build a Tic-Tac-Toe Game in Svelte

Show steps

Practice Svelte's core concepts by building a simple but engaging game.

Browse courses on Tic-Tac-Toe

Show steps

Create a new Svelte project for the game
Implement the game logic
Design the game's user interface
Test the game's functionality

Create a To Do List App in Svelte with Jest

Show steps

Reinforce your understanding of Svelte by developing a real-world application and testing it with Jest.

Show steps

Set up a new Svelte project
Create a simple to-do list interface
Implement Jest for testing
Write tests for the to-do list functionality

Design a Svelte Component Library

Show steps

Deepen your understanding of Svelte by creating a reusable component library that solves a specific problem.

Browse courses on Component Library

Show steps

Identify a problem that can be solved with reusable Svelte components
Design the components and their functionality
Develop and test the component library
Document and share your library

Participate in a Svelte Hackathon

Show steps

Challenge yourself and apply your Svelte skills in a competitive environment.

Show steps

Find an upcoming Svelte hackathon
Form a team or work solo
Develop a Svelte-based project within the hackathon's timeframe
Present your project and compete for prizes

Career center

Learners who complete Svelte with Test Driven Development will develop knowledge and skills that may be useful to these careers:

Reading list

We haven't picked any books for this reading list yet.

Svelte with Test Driven Development

What's inside

Learning objectives

Syllabus

Traffic lights

Save this course

Reviews summary

Svelte and tdd: a practical project guide

Activities

Career center

Reading list

Share

Similar courses