目錄(271章)
倒序
- 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
推薦閱讀
- Vue.js前端開發基礎與項目實戰
- 算法精粹：經典計算機科學問題的Java實現
- Visual C++實例精通
- Magento 2 Development Cookbook
- 零基礎學Java程序設計
- Mastering Apache Spark 2.x（Second Edition）
- Multithreading in C# 5.0 Cookbook
- iOS自動化測試實戰：基于Appium、Python與Pytest
- Python機器學習：預測分析核心算法
- 鴻蒙OS應用編程實戰
- R語言：邁向大數據之路（加強版）
- Three.js權威指南：在網頁上創建3D圖形和動畫的方法與實踐（原書第4版）
- Mapping with ArcGIS Pro
- Java EE 程序設計
- Visual FoxPro程序設計教程（第3版）
- React Router Quick Start Guide
- 軟件測試（第2版）
- AWS Administration：The Definitive Guide
- CMake Cookbook
- Helm學習指南：Kubernetes上的應用程序管理
- H5設計與運營（視頻指導版）
- C語言編程兵書
- 新印象：中文版Sketch圖標與UI界面設計實例教程
- 數據結構編程實驗（第3版）
- 零基礎看圖學Scratch 3.0少兒趣味編程（全彩大字版）
- Java代碼審計（入門篇）
- Spring Cloud Alibaba 微服務原理與實戰
- 從零開始學C++程序設計
- OpenCV 4 with Python Blueprints
- Scala for Java Developers
