更新时间:2021-07-02 12:53:50
coverpage
Title Page
Copyright and Credits
Create React App 2 Quick Start Guide
Dedication
About Packt
Why subscribe?
Packt.com
Contributors
About the author
About the reviewer
Packt is searching for authors like you
Preface
Who this book is for
What this book covers
To get the most out of this book
Download the example code files
Download the color images
Conventions used
Get in touch
Reviews
Introducing Create React App 2
What is Create React App?
What is the history of Create React App?
The early days of JavaScript development
The bundle era
What problems does CRA solve?
Installing prerequisites for Create React App
Creating our first Create React App project
A quick look at the options of CRA
The yarn start command
The yarn build command
The yarn test command
The yarn eject command
Let's explore the created project
Adding code to our project
Creating our first component
Wait what is JSX?
Embedding style sheets in our component
Looking forward – what will we do?
The project plan
Summary
Creating Our First Create React App Application
Creating our first major project
Designing our application
Building the baseline functionality for our application
Creating our project
Initializing our components to build on top off
Building separate components in separate files
Introducing props
Writing a class-based component
Bringing state into our component
Adding interactivity via state modifications
Indicating our state with CSS
Iterating our project further
Building a List component
Adding the TodoList to our App
Adding state to TodoList
Creating and using a helper render() function
Creating a new Todo component
Passing a function as a prop
Removing items is important too
Create React App and Babel
Babel and the latest JavaScript syntax
What is Babel?
Understanding the history
Where does Babel fit into the puzzle?
Exploring modern JavaScript with Babel
JSX
Function syntax
Destructuring
Optional arguments
The spread operator
React Fragments
A quick recap
Keep Your App Healthy with Tests and Jest
The why and when of testing
The history of testing React
About Jest
Analyzing the structure of Jest tests
Exploring the test output
A development test workflow with the F key
It's time to add some new tests!
Writing a generic snapshot test
Writing tests for content
What’s a shallow render?
Testing interactions
Completing our interactivity tests
Returning to our mocked function
Adding tests for TodoList
Adding tests for NewTodo
Applying Modern CSS to Create React App Projects
What tools are available?
CSS conflicts can ruin your application
A quick example of CSS conflicts
Introducing CSS Modules
Better project organization