Building a JavaScript Development Environment

Focused View

Cory House

4:54:24

17 View

01. Course Overview

01. Course Overview.mp4

01:30

02. You Need a Starter Kit

02. You Need a Starter Kit.mp4

02:35

03. A Starter Kit Is an Automated Checklist.mp4

02:34

04. Who Is This Course For.mp4

04:49

05. What Belongs in Your Starter Kit.mp4

01:16

06. Set up Github.mp4

02:56

07. Agenda.mp4

03:53

08. Summary.mp4

01:29

03. Editors and Configuration

09. Intro.mp4

00:36

10. What to Look for in a JavaScript Editor.mp4

02:46

11. JavaScript Editor Recommendations.mp4

01:43

12. Automating Formatting.mp4

01:47

13. Demo-Editorconfig.mp4

01:54

14. Summary.mp4

00:41

04. Package Management

15. Intro.mp4

00:47

16. Package Managers.mp4

00:35

17. Demo-Install Node and npm Packages.mp4

03:43

18. Package Security.mp4

00:42

19. Demo-npm audit.mp4

01:24

20. Summary.mp4

00:42

05. Development Web Server

21. Intro.mp4

00:35

22. Development Web Servers.mp4

04:13

23. Demo-Set up Express.mp4

04:15

24. Sharing Work-in-progress.mp4

05:49

25. Demo-Sharing Work-in-progress.mp4

03:31

26. Summary.mp4

00:36

06. Automation

27. Intro.mp4

00:38

28. Automation Options.mp4

04:55

29. Demo-npm Scripts.mp4

01:48

30. Demo-Pre Post Hooks.mp4

01:36

31. Demo-Create Share Script.mp4

01:00

32. Demo-Concurrent Tasks.mp4

01:42

33. Summary.mp4

00:42

07. Transpiling

34. Intro.mp4

00:57

35. JavaScript Versions.mp4

01:34

36. Transpilers.mp4

03:37

37. Babel Configuration.mp4

01:52

38. Transpiling Build Scripts.mp4

00:57

39. Demo-Set up Babel.mp4

03:40

40. Summary.mp4

01:17

08. Bundling

41. Intro.mp4

01:27

42. Module Formats.mp4

01:44

43. Why ES6 Modules.mp4

02:25

44. Choosing a Bundler.mp4

06:22

45. Demo-Configuring Webpack.mp4

04:00

46. Demo-Configure Webpack with Express.mp4

01:36

47. Demo-Create App Entry Point .mp4

03:20

48. Demo-Handling CSS with Webpack .mp4

02:10

49. Sourcemaps.mp4

01:20

50. Demo-Debugging via Sourcemaps.mp4

01:46

51. Summary.mp4

01:18

09. Linting

52. Intro.mp4

00:49

53. Why Lint.mp4

01:55

54. Linters.mp4

00:51

55. ESLint Configuration Decisions Overview.mp4

00:44

56. Decision 1-Configuration File Format.mp4

00:59

57. Decision 2-Which Rules.mp4

00:27

58. Decision 3-Warnings or Errors.mp4

01:46

59. Decision 4-Plugins.mp4

00:47

60. Decision 5-Preset.mp4

02:03

61. Watching Files with ESLint.mp4

01:41

62. Linting Experimental Features.mp4

00:45

63. Why Lint via an Automated Build.mp4

01:17

64. Demo-ESLint Set Up.mp4

07:07

65. Demo-Watching Files.mp4

01:50

66. Summary.mp4

01:09

10. Testing and Continuous Integration

67. Intro.mp4

01:06

68. Test Decisions Overview.mp4

01:49

69. Decision 1-Testing Framework.mp4

02:27

70. Decision 2-Assertion Libraries.mp4

01:21

71. Decision 3-Helper Libraries.mp4

01:23

72. Decision 4-Where To Run Tests.mp4

01:22

73. Decision 5-Where Do Test Files Belong.mp4

03:08

74. Decision 6-When Should Tests Run.mp4

02:47

75. Demo-Testing Setup.mp4

04:52

76. Demo-DOM Testing.mp4

03:12

77. Demo-Watching Tests.mp4

01:07

78. Why Continuous Integration.mp4

01:54

79. What Does Continuous Integration Do.mp4

01:03

80. Choosing a CI Server.mp4

01:15

81. Demo-Travis CI.mp4

05:48

82. Demo-Appveyor.mp4

03:28

83. Summary.mp4

01:46

11. HTTP Calls

84. Intro.mp4

00:59

85. HTTP Call Approaches.mp4

04:16

86. Centralizing HTTP Requests.mp4

01:26

87. Demo-Fetch.mp4

06:39

88. Selective Polyfilling.mp4

01:11

89. Why Mock HTTP.mp4

01:05

90. How to Mock HTTP.mp4

03:50

91. Our Plan for Mocking.mp4

02:11

92. Mocking Libraries.mp4

03:18

93. Demo-Creating a Mock API Data Schema.mp4

02:52

94. Demo-Generating Mock Data.mp4

02:39

95. Demo-Serving Mock Data via JSON Server.mp4

05:54

96. Demo-Manipulating Data via JSON Server.mp4

04:32

97. Summary.mp4

02:08

12. Project Structure

98. Intro.mp4

00:44

99. Why a Demo App.mp4

01:38

100. Tip 1-JS Belongs in a .js File.mp4

03:35

101. Tip 2-Consider Organizing by Feature.mp4

00:49

102. Tip 3-Extract Logic to POJOs.mp4

01:34

103. Summary.mp4

01:25

13. Production Build

104. Intro.mp4

00:55

105. Minification and Sourcemaps.mp4

01:04

106. Demo-Production Webpack Configuration with Minification.mp4

01:47

107. Demo-Configure Local dist Server.mp4

02:48

108. Demo-Toggle Mock API.mp4

02:52

109. Demo-Production Build npm Scripts.mp4

02:20

110. Dynamic HTML Generation.mp4

02:26

111. Demo-Dynamic HTML Generation.mp4

03:51

112. Bundle Splitting.mp4

01:17

113. Demo-Bundle Splitting.mp4

04:10

114. Cache Busting.mp4

01:35

115. Demo-Cache Busting.mp4

02:35

116. Demo-Extract and Minify CSS.mp4

01:47

117. Error Logging.mp4

01:45

118. Demo-Error Logging.mp4

04:05

119. Demo-HTML Templates via EmbeddedJS.mp4

04:17

120. Summary.mp4

01:20

14. Production Deploy

121. Intro.mp4

00:51

122. Separating the UI and API.mp4

02:23

123. Cloud Hosting.mp4

01:08

124. Demo-Automated API Deploy via Heroku.mp4

08:51

125. Demo-Automated UI Deploy via Surge.mp4

02:51

126. Starter Kit Update Approaches.mp4

01:14

127. Option 1-Yeoman.mp4

01:07

128. Option 2-Github.mp4

00:21

129. Option 3-npm.mp4

03:18

130. Inspiration.mp4

01:16

131. Challenge.mp4

01:15

132. Summary.mp4

01:08

Description

Starting a new JavaScript project from scratch is overwhelming. This course provides a playbook outlining the key decisions you need to make. Build a robust development environment that handles bundling, linting, transpiling, testing, and much more.

What You'll Learn?

Welcome to Building a JavaScript Development Environment. In this course, you will explore the long list of decisions and patterns for building your own JavaScript development from scratch using modern tooling. You will get there by learning about major topics like transpiling, bundling, testing, and npm scripts for automation.

By the end of this course, you will be able to create a rapid feedback JavaScript development experience that suits your team's unique preferences.

Before you begin, make sure you are already familiar with JavaScript and HTML.

After this course, you'll be ready to move on to building applications in a wide array of technologies including Angular, React, Node.js, and Electron.

I hope you'll join me, and I look forward to helping you on your learning journey here at Pluralsight.

More details

User Reviews

Rating

average 0

Total votes0

Focused display

JavaScript

Cory House

Instructor's Courses

Cory is the principal consultant at reactjsconsulting.com, where he has helped dozens of companies transition to React. Cory has trained over 10,000 software developers at events and businesses worldwide. He is a seven time Microsoft MVP, and speaks regularly at conferences around the world. Cory lives in Kansas City and is active on Twitter as @housecor.

Pluralsight

View courses Pluralsight

Pluralsight, LLC is an American privately held online education company that offers a variety of video training courses for software developers, IT administrators, and creative professionals through its website. Founded in 2004 by Aaron Skonnard, Keith Brown, Fritz Onion, and Bill Williams, the company has its headquarters in Farmington, Utah. As of July 2018, it uses more than 1,400 subject-matter experts as authors, and offers more than 7,000 courses in its catalog. Since first moving its courses online in 2007, the company has expanded, developing a full enterprise platform, and adding skills assessment modules.