Урок 1.00:01:23
Course Overview
Урок 2.00:02:08
Intro
Урок 3.00:01:01
Agenda
Урок 4.00:04:36
Why Reusable Components?
Урок 5.00:03:11
Why Not Web Components?
Урок 6.00:04:33
Why React?
Урок 7.00:00:55
Decision Overview
Урок 8.00:01:43
Decision 1: Audience
Урок 9.00:03:41
Decision 2: Rigid vs. Flexible
Урок 10.00:02:54
Warning: Tragedy of the Commons
Урок 11.00:06:45
Decision 3: Link, Wrap, or Fork Third Parties?
Урок 12.00:03:26
Decision 4: When Should I Add Components to My Library?
Урок 13.00:00:52
How I'm Handling Demos and Issues
Урок 14.00:01:39
Summary
Урок 15.00:00:51
Intro
Урок 16.00:06:30
Library vs. Standalone
Урок 17.00:05:18
Environment Option 1: Boilerplate
Урок 18.00:04:33
Environment Option 2: Documentation Tool
Урок 19.00:03:47
Environment Option 3: Custom
Урок 20.00:01:16
Install Node and Git
Урок 21.00:01:48
Demo: Create GitHub Repository
Урок 22.00:05:53
Demo: Create Project with Create React App
Урок 23.00:04:06
Demo: Eject Create React App
Урок 24.00:01:00
Summary
Урок 25.00:00:51
Intro
Урок 26.00:02:37
Documentation Goals
Урок 27.00:01:22
Why Generate Documentation?
Урок 28.00:00:46
Documentation Tools
Урок 29.00:03:57
Custom Documentation Generation Approach
Урок 30.00:01:06
Demo: Documentation Framework Setup
Урок 31.00:06:14
Demo: Generate Component Metadata
Урок 32.00:03:44
Demo: npm Scripts
Урок 33.00:02:11
Demo: Create HelloWorld Component
Урок 34.00:01:54
Demo: Create Docs Component
Урок 35.00:00:39
Demo: Create Navigation Component
Урок 36.00:01:05
Demo: Create ComponentPage Component
Урок 37.00:03:01
Demo: Create Example Component
Урок 38.00:04:47
Demo: Create Props Component
Урок 39.00:03:35
Demo: Enhance HelloWorld with Comments
Урок 40.00:04:18
Demo: Webpack Alias
Урок 41.00:01:29
Syntax Highlighting
Урок 42.00:03:27
Demo: Syntax Highlighting
Урок 43.00:02:43
Potential Enhancements
Урок 44.00:00:43
Summary
Урок 45.00:00:42
Intro
Урок 46.00:00:41
Tip 1: Avoid Weak Elements
Урок 47.00:01:28
Tip 2: Declare PropTypes
Урок 48.00:01:21
Tip 3: Don’t Hard Code HTML IDs
Урок 49.00:01:23
Tip 4: Declare Logical Defaults
Урок 50.00:01:46
Tip 5: Consider Accessibility
Урок 51.00:01:42
Tip 6: Consider Configuration Objects
Урок 52.00:01:40
Tip 7: Consider Server-side Rendering
Урок 53.00:01:33
Tip 8: Honor the Single Responsibility Principle
Урок 54.00:05:28
What Is Atomic Design?
Урок 55.00:01:25
Why Atomic Design?
Урок 56.00:01:14
Summary
Урок 57.00:00:35
Intro
Урок 58.00:00:51
What's an Atom?
Урок 59.00:02:26
Decision 1: Wrap HTML Primitives?
Урок 60.00:03:34
Decision 2: Folder Structure
Урок 61.00:00:55
Tip 1: Honor the Native API
Урок 62.00:01:06
Tip 2: Pass Props via Spread
Урок 63.00:02:09
Tip 3: Use Spread with Destructuring
Урок 64.00:00:56
Tip 4: Create Formatting Components
Урок 65.00:07:41
Demo: ProgressBar Atom
Урок 66.00:04:29
Demo: Label Atom
Урок 67.00:02:01
Demo: Icon Atom
Урок 68.00:00:58
Summary
Урок 69.00:00:44
Intro
Урок 70.00:01:36
What's a Molecule?
Урок 71.00:06:18
Demo: TextInput Molecule
Урок 72.00:01:41
TextInput Review
Урок 73.00:06:47
Demo: PasswordInput
Урок 74.00:01:17
PasswordInput Review
Урок 75.00:00:53
Summary
Урок 76.00:00:49
Intro
Урок 77.00:00:54
What's an Organism?'
Урок 78.00:02:19
Tip 1: Strong Opinions Are a Feature
Урок 79.00:04:42
Tip 2: Keep Organisms Dumb
Урок 80.00:07:18
Demo: RegistrationForm Organism
Урок 81.00:00:59
Summary
Урок 82.00:01:08
Intro
Урок 83.00:02:36
Compiled CSS
Урок 84.00:03:13
Naming Schemes
Урок 85.00:05:04
Demo: CSS with BEM
Урок 86.00:03:57
React Inline Styles
Урок 87.00:04:12
CSS Modules
Урок 88.00:08:05
Demo: CSS Modules
Урок 89.00:04:24
CSS in JS
Урок 90.00:06:12
Demo: CSS in JS via Styled-components
Урок 91.00:08:33
Decision: Styling Approach
Урок 92.00:04:02
Decision: Unstyled, Enforced, or Themeable?
Урок 93.00:02:31
Theming Approaches
Урок 94.00:00:54
Summary
Урок 95.00:01:33
Intro
Урок 96.00:02:50
Decision 1: Framework
Урок 97.00:05:28
Decision 2: Testing Types
Урок 98.00:00:41
Decision 3: Assertion Library
Урок 99.00:00:40
Decision 4: Helper Libraries
Урок 100.00:01:00
Decision 5: Where to Run Tests
Урок 101.00:00:49
Decision 6: Where to Place Test Files
Урок 102.00:00:49
Decision 7: When to Run Tests
Урок 103.00:08:13
Demo: Unit Test
Урок 104.00:05:36
Demo: Snapshot Test
Урок 105.00:05:22
Demo: Interaction Test
Урок 106.00:01:42
Continuous Integration
Урок 107.00:04:47
Demo: Continuous Integration
Урок 108.00:01:14
Summary
Урок 109.00:01:04
Intro
Урок 110.00:03:31
Decision 1: Open, Closed, or Inner Source?
Урок 111.00:03:28
Decision 2: Package Hosting
Урок 112.00:04:38
Decision 3: Import Approaches
Урок 113.00:05:10
Decision 4: Declaring Package Files
Урок 114.00:00:53
Decision 5: Output Format
Урок 115.00:06:30
ES Module Build
Урок 116.00:03:11
UMD Build
Урок 117.00:00:54
Decision 6: Documentation Hosting
Урок 118.00:01:33
Summary
Урок 119.00:00:59
Intro
Урок 120.00:03:22
Demo: Publish Docs via GitHub Pages
Урок 121.00:02:21
Demo: Set up Readme
Урок 122.00:01:13
Demo: Initial npm Configuration
Урок 123.00:05:22
Demo: Production Component Library Build
Урок 124.00:02:14
Preparing package.json for Publish
Урок 125.00:00:35
Demo: Add Named Import Support
Урок 126.00:04:53
Demo: Prepare package.json for Publish
Урок 127.00:01:28
Demo: Publish npm Package
Урок 128.00:03:04
Demo: Consume npm Package
Урок 129.00:02:11
Demo: Compare Import Approaches
Урок 130.00:02:05
Decision: Pick a Direct Import Approach
Урок 131.00:01:02
Adding Short Direct Import Support
Урок 132.00:06:06
Demo: Add Short Direct Import Support
Урок 133.00:04:08
Demo: Releases
Урок 134.00:02:51
Semantic Versioning
Урок 135.00:00:51
Accepting Contributions
Урок 136.00:01:32
Inspiration
Урок 137.00:00:54
Challenge