最新章節
- Summary
- Closing words
- Building your own backend
- Interactive without React
- Create chat rooms
- Include file upload
品牌：中圖公司
上架時間：2021-07-08 09:16:56
出版社：Packt Publishing
本書數字版權由中圖公司提供，并由其授權上海閱文信息技術有限公司制作發行
- Summary 更新時間：2021-07-08 09:37:01
- Closing words
- Building your own backend
- Interactive without React
- Create chat rooms
- Include file upload
- Show when typing
- Show online status
- Switch to Preact
- Stretch goals
- Progressive-webapp-config
- Generator-pwa
- UpUp
- Dynamic Service Workers (DSW)
- Sw-offline-google-analytics
- Serviceworker-rails
- Manifest-json
- Offline-plugin
- Sw-toolbox
- Sw-precache
- Workbox
- Tools
- Apple’s refusal to support Progressive Web Apps is a detriment to the future of the web
- Trick users into thinking your site's faster than it is
- Instant Loading Web Apps With An Application Shell Architecture
- Designed Degradations - UX Patterns for Hostile Environments
- Progressing the Web
- Transforming an existing Angular application into a Progressive Web App
- A Progressive Web Application with Vue JS
- Why are App Install Banners Still a thing?
- Twitter Lite and High Performance React Progressive Web Apps at Scale
- Testing service workers
- A BIG list of Progressive Web App tips & tricks
- Native apps are doomed
- Articles to read
- 2048 Puzzle
- Notes
- React Hacker News
- PWA.rocks
- Example applications
- SUUMO case study
- Konga case study
- Jumia case study
- eXtra Electronics case study
- AliExpress case study
- Building the Google I/O 2016 Progressive Web App
- Case studies
- Learning resources
- Next steps
- Conclusion and Next Steps
- Summary
- Logging the results
- Using Lighthouse to assess the served page
- Serving our build folder
- Using the Lighthouse CLI
- Evaluating the readout
- Our first audit
- The Audits tab
- The criteria
- What is Lighthouse?
- Auditing Our App
- Summary
- Testing our cache
- Loop over them
- Grab the list of cache names
- The activate event
- The fetch event
- Adding the relevant URLs to the cache
- Parsing the JSON
- Fetching the asset manifest
- Opening up the cache
- The install event
- Setting up our cache
- The asset manifest
- Methods
- The Cache API
- The importance of caching
- What is caching?
- Ready to Cache
- Summary
- Lazy loading
- Route splitting
- AsyncComponent
- Higher-order components
- Conditional imports
- Babel stage 1
- Webpack configuration
- What is code splitting?
- Lazy-load
- Pre-cache
- Render
- Push
- The PRPL pattern
- Chunking JavaScript to Optimize Performance with Webpack
- Summary
- Moving the loading indicator
- Moving CSS out of React
- Moving shell HTML out of React
- The app shell pattern
- PageSpeed Insights
- Screenshots
- Waterfall
- Network requests
- The Summary tab
- Measuring using the timeline
- Timeline
- Response
- Animation
- Idle
- Load
- The RAIL model
- What is progressive enhancement?
- The App Shell
- Summary
- Listening for the event
- Delaying the app install banner
- App install banners and you
- Making our app installable - iOS
- Linking our manifest
- Other properties
- Manifest properties
- Making our app installable - Android
- Browser support
- What is an app manifest?
- Making Our App Installable with a Manifest
- Summary
- Checking the tokens
- Checking the Service Worker
- Checking the Cloud Functions logs
- Debugging push notifications
- Testing our push notifications
- Sending to the tokens
- Writing our Cloud function
- Sending push notifications
- Updating an existing token
- Creating a new token
- Changing the user inside NotificationResource
- Attaching a user to the token
- Tracking tokens
- Requesting permission
- Using a Service Worker to Send Push Notifications
- Summary
- Naming our service worker
- Adding Firebase to our service worker
- Experiencing the service worker life cycle
- Logging out the result
- Registering the service worker
- Listening for the page load
- Checking for browser support
- Registering our first service worker
- The service worker life cycle
- What is a service worker?
- Adding a Service Worker
- Summary
- The Profile page
- Loading indicator
- React refs
- Scrolling down
- Batching user messages
- Multiple users
- Message display improvements
- Displaying our messages
- Loading data from Firebase
- Our message data
- Sending a message to Firebase
- Creating a message
- Managing data flow
- ChatContainer skeleton
- User stories progress
- Completing Our App
- Summary
- Our third Route
- Detour - higher order components
- Logging out
- Redirecting on login
- Our first two Routes
- Our BrowserRouter
- Installing React Router
- Our ChatContainer
- The React Router difference
- Pages on pages
- The plan
- Routing with React
- Summary
- Lifecycle methods
- Event listeners
- Saving our user
- Signing up
- Code cleanup
- Back to authentication
- What is a promise?
- Authentication with Firebase
- Deploying Firebase
- Hiding our API key
- Setting up
- Firebase gotchas
- What is Firebase?
- Easy Backend Setup With Firebase
- Summary
- Reusing components
- State in React
- Our second component
- Class components versus functional components
- Controversies and Separation of Concerns
- What is a React component?
- Our App's Login Page
- Summary
- Making an asset manifest
- Creating a custom script
- Building for production
- Hot reloading
- Splitting up our app
- Our first ES6
- Webpack loaders
- Our Dev server
- Shortcuts
- Moving our React
- Bundling files
- Welcome to Webpack
- Our project structure
- Getting Started with Webpack
- Summary
- Welcome to ReactDOM
- Using React
- Installing React
- Project initiation
- The dark side of npm
- Node setup
- What is npm?
- Meta tags and favicons
- CSS and assets
- Our app skeleton
- Let's get going
- Progressive enhancement
- Mobile-first design
- Offline access
- Push notifications
- Instant loading
- Application challenges
- User stories
- A rose by any other name
- Why React?
- Why Progressive Web Apps?
- Beginning work
- The other problem
- The problem
- Setting the scene
- Creating Our App Structure
- Questions
- Piracy
- Errata
- Downloading the example code
- Customer support
- Reader feedback
- Conventions
- Who this book is for
- What you need for this book
- What this book covers
- Preface
- Customer Feedback
- Why subscribe?
- www.PacktPub.com
- About the Reviewer
- About the Author
- Credits
- Progressive Web Apps with React
- Copyright
- Title Page
- coverpage
- coverpage
- Title Page
- Copyright
- Progressive Web Apps with React
- Credits
- About the Author
- About the Reviewer
- www.PacktPub.com
- Why subscribe?
- Customer Feedback
- Preface
- What this book covers
- What you need for this book
- Who this book is for
- Conventions
- Reader feedback
- Customer support
- Downloading the example code
- Errata
- Piracy
- Questions
- Creating Our App Structure
- Setting the scene
- The problem
- The other problem
- Beginning work
- Why Progressive Web Apps?
- Why React?
- A rose by any other name
- User stories
- Application challenges
- Instant loading
- Push notifications
- Offline access
- Mobile-first design
- Progressive enhancement
- Let's get going
- Our app skeleton
- CSS and assets
- Meta tags and favicons
- What is npm?
- Node setup
- The dark side of npm
- Project initiation
- Installing React
- Using React
- Welcome to ReactDOM
- Summary
- Getting Started with Webpack
- Our project structure
- Welcome to Webpack
- Bundling files
- Moving our React
- Shortcuts
- Our Dev server
- Webpack loaders
- Our first ES6
- Splitting up our app
- Hot reloading
- Building for production
- Creating a custom script
- Making an asset manifest
- Summary
- Our App's Login Page
- What is a React component?
- Controversies and Separation of Concerns
- Class components versus functional components
- Our second component
- State in React
- Reusing components
- Summary
- Easy Backend Setup With Firebase
- What is Firebase?
- Firebase gotchas
- Setting up
- Hiding our API key
- Deploying Firebase
- Authentication with Firebase
- What is a promise?
- Back to authentication
- Code cleanup
- Signing up
- Saving our user
- Event listeners
- Lifecycle methods
- Summary
- Routing with React
- The plan
- Pages on pages
- The React Router difference
- Our ChatContainer
- Installing React Router
- Our BrowserRouter
- Our first two Routes
- Redirecting on login
- Logging out
- Detour - higher order components
- Our third Route
- Summary
- Completing Our App
- User stories progress
- ChatContainer skeleton
- Managing data flow
- Creating a message
- Sending a message to Firebase
- Our message data
- Loading data from Firebase
- Displaying our messages
- Message display improvements
- Multiple users
- Batching user messages
- Scrolling down
- React refs
- Loading indicator
- The Profile page
- Summary
- Adding a Service Worker
- What is a service worker?
- The service worker life cycle
- Registering our first service worker
- Checking for browser support
- Listening for the page load
- Registering the service worker
- Logging out the result
- Experiencing the service worker life cycle
- Adding Firebase to our service worker
- Naming our service worker
- Summary
- Using a Service Worker to Send Push Notifications
- Requesting permission
- Tracking tokens
- Attaching a user to the token
- Changing the user inside NotificationResource
- Creating a new token
- Updating an existing token
- Sending push notifications
- Writing our Cloud function
- Sending to the tokens
- Testing our push notifications
- Debugging push notifications
- Checking the Cloud Functions logs
- Checking the Service Worker
- Checking the tokens
- Summary
- Making Our App Installable with a Manifest
- What is an app manifest?
- Browser support
- Making our app installable - Android
- Manifest properties
- Other properties
- Linking our manifest
- Making our app installable - iOS
- App install banners and you
- Delaying the app install banner
- Listening for the event
- Summary
- The App Shell
- What is progressive enhancement?
- The RAIL model
- Load
- Idle
- Animation
- Response
- Timeline
- Measuring using the timeline
- The Summary tab
- Network requests
- Waterfall
- Screenshots
- PageSpeed Insights
- The app shell pattern
- Moving shell HTML out of React
- Moving CSS out of React
- Moving the loading indicator
- Summary
- Chunking JavaScript to Optimize Performance with Webpack
- The PRPL pattern
- Push
- Render
- Pre-cache
- Lazy-load
- What is code splitting?
- Webpack configuration
- Babel stage 1
- Conditional imports
- Higher-order components
- AsyncComponent
- Route splitting
- Lazy loading
- Summary
- Ready to Cache
- What is caching?
- The importance of caching
- The Cache API
- Methods
- The asset manifest
- Setting up our cache
- The install event
- Opening up the cache
- Fetching the asset manifest
- Parsing the JSON
- Adding the relevant URLs to the cache
- The fetch event
- The activate event
- Grab the list of cache names
- Loop over them
- Testing our cache
- Summary
- Auditing Our App
- What is Lighthouse?
- The criteria
- The Audits tab
- Our first audit
- Evaluating the readout
- Using the Lighthouse CLI
- Serving our build folder
- Using Lighthouse to assess the served page
- Logging the results
- Summary
- Conclusion and Next Steps
- Next steps
- Learning resources
- Case studies
- Building the Google I/O 2016 Progressive Web App
- AliExpress case study
- eXtra Electronics case study
- Jumia case study
- Konga case study
- SUUMO case study
- Example applications
- PWA.rocks
- React Hacker News
- Notes
- 2048 Puzzle
- Articles to read
- Native apps are doomed
- A BIG list of Progressive Web App tips & tricks
- Testing service workers
- Twitter Lite and High Performance React Progressive Web Apps at Scale
- Why are App Install Banners Still a thing?
- A Progressive Web Application with Vue JS
- Transforming an existing Angular application into a Progressive Web App
- Progressing the Web
- Designed Degradations - UX Patterns for Hostile Environments
- Instant Loading Web Apps With An Application Shell Architecture
- Trick users into thinking your site's faster than it is
- Apple’s refusal to support Progressive Web Apps is a detriment to the future of the web
- Tools
- Workbox
- Sw-precache
- Sw-toolbox
- Offline-plugin
- Manifest-json
- Serviceworker-rails
- Sw-offline-google-analytics
- Dynamic Service Workers (DSW)
- UpUp
- Generator-pwa
- Progressive-webapp-config
- Stretch goals
- Switch to Preact
- Show online status
- Show when typing
- Include file upload
- Create chat rooms
- Interactive without React
- Building your own backend
- Closing words
- Summary 更新時間：2021-07-08 09:37:01
