舉報

會員
Create React App 2 Quick Start Guide
Ifyou'reapoweruserandyouaren’thappyalwaysreusingdefaultconfigurations,frompreviousapplicationswitheachnewapplication,thenallyouneedisCreateReactApp(CRA),atoolintheReactecosystemdesignedtohelpyoucreateboilerplatecodeforbuildingawebfrontend.ThisbookwillhelpyouuseCRAtowriteReactprogramswithoutsignificantconfiguration-relateddifficulties.Withthisquickstartguide,youwillintegrateyourapplicationswithReacttobuildefficientprofessionalwebservices.YouwilllearntodesignUIswiththefeaturesofCRAandtemplateyourReactapplications.Bytheendofthebook,youwillbesufficientlyskilledtobeabletobuildfasterandeffectiveReactappsusingCRA.
最新章節
- Leave a review - let other readers know what you think
- Other Books You May Enjoy
- Summary
- Drawbacks of using eject
- How to eject
- Ejecting our project
品牌:中圖公司
上架時間:2021-07-02 12:24:45
出版社:Packt Publishing
本書數字版權由中圖公司提供,并由其授權上海閱文信息技術有限公司制作發行
- Leave a review - let other readers know what you think 更新時間:2021-07-02 12:53:50
- Other Books You May Enjoy
- Summary
- Drawbacks of using eject
- How to eject
- Ejecting our project
- Thoughts on the deployment process
- How to create a production build
- Creating a production build
- Adding Redux for state management
- React Final Form
- React Router
- Other popular React libraries
- Adding other libraries
- Getting Your App Ready for Production
- Summary
- How can we use a Service Worker in our app?
- The Service Worker life cycle
- What is a Service Worker?
- Hooking up Service Workers
- Customizing our manifest file
- theme_color
- scope
- orientation
- display
- background_color
- start_url
- icons
- name and short_name
- Exploring the manifest file options
- Viewing our manifest file in action with Chrome
- Starting with our manifest file
- Building a PWA in Create React App
- How do we define a PWA?
- What is a PWA?
- Understanding and building PWAs
- Building Progressive Web Applications
- Summary
- Finally fixing our last failing test suite
- Implementing our service library in TodoList
- Building service libraries
- Fixing our last failing test suite through refactoring
- Fixing the Todo test
- Getting back to passing tests
- Deleting a Todo
- Creating a new Todo on the server
- Getting our list of Todos from the server
- Introducing Fetch
- Working with Async/Await
- Communicating with your proxy server with React
- Where to put API requests
- The React component life cycle for mounting
- Building the remove Todo API request
- Building the add Todo API request
- Building the Todos index API request
- Figuring out our backend requests
- Setting up the backend API
- Simulating a backend server with the proxy API
- Simulate Your Backend with a Proxy API
- Summary
- Making our tests pass again
- Cleaning up our Todo component
- Cleaning up the NewTodo component
- Cleaning up our design starting with the header
- Adding CSS frameworks
- Mixing SASS and CSS Modules
- Installing and configuring SASS
- What is SASS?
- Introducing SASS to our project
- Composability with CSS Modules
- Introducing CSS Modules to our application
- How to use CSS Modules
- Better project organization
- Introducing CSS Modules
- A quick example of CSS conflicts
- CSS conflicts can ruin your application
- What tools are available?
- Applying Modern CSS to Create React App Projects
- Summary
- Adding tests for NewTodo
- Adding tests for TodoList
- Returning to our mocked function
- Completing our interactivity tests
- Testing interactions
- What’s a shallow render?
- Writing tests for content
- Writing a generic snapshot test
- It's time to add some new tests!
- A development test workflow with the F key
- Exploring the test output
- Analyzing the structure of Jest tests
- About Jest
- The history of testing React
- The why and when of testing
- Keep Your App Healthy with Tests and Jest
- Summary
- A quick recap
- React Fragments
- The spread operator
- Optional arguments
- Destructuring
- Function syntax
- JSX
- Exploring modern JavaScript with Babel
- Where does Babel fit into the puzzle?
- Understanding the history
- What is Babel?
- Babel and the latest JavaScript syntax
- Create React App and Babel
- Summary
- Removing items is important too
- Passing a function as a prop
- Creating a new Todo component
- Creating and using a helper render() function
- Adding state to TodoList
- Adding the TodoList to our App
- Building a List component
- Iterating our project further
- Indicating our state with CSS
- Adding interactivity via state modifications
- Bringing state into our component
- Writing a class-based component
- Introducing props
- Building separate components in separate files
- Initializing our components to build on top off
- Creating our project
- Building the baseline functionality for our application
- Designing our application
- Creating our first major project
- Creating Our First Create React App Application
- Summary
- The project plan
- Looking forward – what will we do?
- Embedding style sheets in our component
- Wait what is JSX?
- Creating our first component
- Adding code to our project
- Let's explore the created project
- The yarn eject command
- The yarn test command
- The yarn build command
- The yarn start command
- A quick look at the options of CRA
- Creating our first Create React App project
- Installing prerequisites for Create React App
- What problems does CRA solve?
- The bundle era
- The early days of JavaScript development
- What is the history of Create React App?
- What is Create React App?
- Introducing Create React App 2
- Reviews
- Get in touch
- Conventions used
- Download the color images
- Download the example code files
- To get the most out of this book
- What this book covers
- Who this book is for
- Preface
- Packt is searching for authors like you
- About the reviewer
- About the author
- Contributors
- Packt.com
- Why subscribe?
- About Packt
- Dedication
- Create React App 2 Quick Start Guide
- Copyright and Credits
- Title Page
- coverpage
- 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
- Summary
- 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
- Summary
- 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
- Summary
- 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
- How to use CSS Modules
- Introducing CSS Modules to our application
- Composability with CSS Modules
- Introducing SASS to our project
- What is SASS?
- Installing and configuring SASS
- Mixing SASS and CSS Modules
- Adding CSS frameworks
- Cleaning up our design starting with the header
- Cleaning up the NewTodo component
- Cleaning up our Todo component
- Making our tests pass again
- Summary
- Simulate Your Backend with a Proxy API
- Simulating a backend server with the proxy API
- Setting up the backend API
- Figuring out our backend requests
- Building the Todos index API request
- Building the add Todo API request
- Building the remove Todo API request
- The React component life cycle for mounting
- Where to put API requests
- Communicating with your proxy server with React
- Working with Async/Await
- Introducing Fetch
- Getting our list of Todos from the server
- Creating a new Todo on the server
- Deleting a Todo
- Getting back to passing tests
- Fixing the Todo test
- Fixing our last failing test suite through refactoring
- Building service libraries
- Implementing our service library in TodoList
- Finally fixing our last failing test suite
- Summary
- Building Progressive Web Applications
- Understanding and building PWAs
- What is a PWA?
- How do we define a PWA?
- Building a PWA in Create React App
- Starting with our manifest file
- Viewing our manifest file in action with Chrome
- Exploring the manifest file options
- name and short_name
- icons
- start_url
- background_color
- display
- orientation
- scope
- theme_color
- Customizing our manifest file
- Hooking up Service Workers
- What is a Service Worker?
- The Service Worker life cycle
- How can we use a Service Worker in our app?
- Summary
- Getting Your App Ready for Production
- Adding other libraries
- Other popular React libraries
- React Router
- React Final Form
- Adding Redux for state management
- Creating a production build
- How to create a production build
- Thoughts on the deployment process
- Ejecting our project
- How to eject
- Drawbacks of using eject
- Summary
- Other Books You May Enjoy
- Leave a review - let other readers know what you think 更新時間:2021-07-02 12:53:50