Developing Mobile Friendly Web Apps with React and Bootstrap

on YouTube ↗53m

" summary

Builds a small React app (created with create-react-app) that displays three sample books from a simulated service, adds Bootstrap via the Bootstrap CDN for responsive tables, and implements an input-with-clear component so users can tap an X to wipe a field on mobile. Encounters repeated cross‑browser and device incompatibilities (Chrome vs Safari, desktop simulator vs real device), solves edge cases by combining onchange and onkeyup, and protects fixes with unit tests so the UI actually works on phones.

AI-written summary · about

" chapters (10)

1. 0:00Introduction to talk
2. 1:02Why React and Bootstrap
3. 5:15Creating React app with books
4. 17:19Styling table with Bootstrap
5. 21:53Making app mobile friendly
6. 30:07UX challenges on mobile
7. 36:58Input with clear component
8. 43:19Cross-device testing tips
9. 46:47Experience report summary
10. 47:18Q&A session

" related talks

• 53mBuilding Web Apps with React.jsPratik Patel · Jfokus 2018
• 33mOne App Fits All: Building Responsive Experiences in ReactKateryna Porshnieva · React Alicante 2024
• 39mBuilding Webapps for everyone - a11y with ReactManjula Dube · React Day Berlin 2019
• 23mBeyond Responsive Design: Building Mobile-Optimized Websites in ReactAlex Holachek · ReactEurope 2020
• 32mNavigating the React Solar SystemBen Ilegbodu · Framework Summit 2018
• 42mConfident web development with ReactJulien Phalip · DjangoCon US 2015
• 48mRadically Accessible Internet Applications 💯Marcy Sutton Todd · Beyond Tellerrand Munich 2018
• 31mThe Bumpy Road to Universal JavaScriptJohannes Ewald · JSCamp 2018