Learn how to set up a development web server.
- [Instructor] Setting Up a Development Server.…In this video we are going to talk about…how to use webpack-dev-server,…how to set up a webpack plugin,…and, at the end, leave everything ready…to start writing our React application in the next section.…So, let's start with webpack-dev-server.…Webpack-dev-server is an express server,…but that has some additional functionality,…that reads your webpack config file,…and keeps a fast in-memory bundle…that you can use for development purposes.…It will also watch your src files,…and recompile the bundle whenever the files change.…
This will enable us to increase our development velocity,…because every time we save a file in our code editor,…we will see that change automatically…refreshed in our browser.…We will see it in a minute.…Webpack-dev-server has a CLI or programmatic configuration,…we will use the CLI in this occasion.…And it's important to say…that it's only for development purposes.…Never use webpack-dev-server in production.…So let's start by installing webpack-dev-server.…
Author
Released
7/16/2018- Structuring React projects
- Creating and mounting the root component
- Composing components for more complex UI
- Using state to making components dynamic
- Styling
- Routing
- Testing
Skill Level Intermediate
Duration
Views
Related Courses
-
React.js: Building an Interface (2016)
with Ray Villalobos1h 21m Intermediate -
React: Building Large Apps
with Emmanuel Henri53m 59s Intermediate -
React: Managing Complex Interactions
with Emmanuel Henri1h 45m Intermediate
-
1. How to Structure React Projects
-
Welcome2m 14s
-
React rendering process2m 24s
-
Start a project from scratch3m 44s
-
Set up a development server9m 31s
-
-
2. Diving into the First Components
-
Use functional components3m 48s
-
Import assets5m 37s
-
3. Styling Made Easy
-
Functional CSS7m 33s
-
Set up PostCSS and Basscss11m 38s
-
Set up ESLint13m 39s
-
Set up Prettier6m 27s
-
4. Routing
-
Handle 404 requests3m 2s
-
Handle redirects1m 32s
-
Implement favorites11m 8s
-
Share state between routes9m 27s
-
Get parameters from URLs6m 48s
-
5. Painless Components Testing
-
Configure Jest5m 44s
-
- Mark as unwatched
- Mark all as unwatched
Are you sure you want to mark all the videos in this course as unwatched?
This will not affect your course history, your reports, or your certificates of completion for this course.
CancelTake notes with your new membership!
Type in the entry box, then click Enter to save your note.
1:30Press on any video thumbnail to jump immediately to the timecode shown.
Notes are saved with you account but can also be exported as plain text, MS Word, PDF, Google Doc, or Evernote.
Share this video
Embed this video
Video: Set up a development server