GitPitch

Roberto Nogueira  
BSd EE, MSd CE
Solution Integrator Experienced - Certified by Ericsson

eBook project Modern Front End Development for Rails

ebook image

About

Learn everything you need to about the subject of this eBook project.

Homepage

Topics

So you want to write some client-side code
[x] Basic assumptions
[x] The tools we'll use
[x] How the book is organized
[x] The sample code
Part I -- Getting started
1. Getting Started
[ ] Getting Started with Client-Side Rails excerpt
[ ] Managing State and Front-End Development
[ ] Configuring Webpacker
[ ] Using Webpacker
[ ] What’s Next
2. Hotwire and Turbo
[ ] The Hotwire Way
[ ] Installing Turbo
[ ] What Is Turbo Drive?
[ ] Adding Interactivity with Turbo Frames
[ ] Navigating Outside a Turbo Frame
[ ] Extending Our Page with Turbo Streams
[ ] Turbo Frames vs. Turbo Streams
[ ] Lazy Loading a Turbo Frame
[ ] What’s Next
3. Stimulus
[ ] What Is Stimulus?
[ ] Installing Stimulus
[ ] Adding Our First Controller
[ ] Creating an Action
[ ] Adding a Target
[ ] Using Values
[ ] Automating Value Changes
[ ] Stimulus Has Class
[ ] Going Generic
[ ] Stimulus Quick Reference
[ ] What’s Next
4. React
[ ] What Is React?
[ ] Installing React
[ ] Adding Our First Component
[ ] Composing Components
[ ] Connecting to the Page
[ ] Interactivity, State, and Hooks excerpt
[ ] Sharing State
[ ] What’s Next
5. Cascading Style Sheets
[ ] Building CSS in webpack
[ ] Adding CSS and Assets to webpack
[ ] Animating CSS
[ ] Adding CSS Transitions
[ ] Animating Turbo Streams with Animate.css
[ ] Using CSS and React Components
[ ] What’s Next
Part II - Going Deeper
6. TypeScript
[ ] Using TypeScript
[ ] Understanding Basic TypeScript Types
[ ] Static vs. Dynamic Typing
[ ] Adding Type Annotations to Variables
[ ] Adding Type Annotations to Functions
[ ] Adding Type Annotations to Classes
[ ] Defining Interfaces
[ ] Type Checking Classes and Interfaces
[ ] Getting Type Knowledge to TypeScript
[ ] What’s Next
7. webpack
[ ] Understanding Why webpack Exists
[ ] Managing Dependencies with Yarn
[ ] Understanding webpack Configuration
[ ] What’s Next
8. Webpacker excerpt
[ ] Webpacker Basics
[ ] Writing Code Using Webpacker
[ ] Integrating Webpacker with Frameworks
[ ] Running webpack
[ ] Deploying Webpacker in Production
[ ] Customizing Webpacker
[ ] What’s Next
Part III - Managing Servers and State
9. Talking to the Server
[ ] Using Stimulus to Manage Forms
[ ] Stimulus and Ajax
[ ] Using Data in Stimulus
[ ] Acquiring Data in React with useState
[ ] What’s Next
10. Immediate Communication with ActionCable
[ ] Installing ActionCable
[ ] Turbo Streams and ActionCable
[ ] Stimulus and ActionCable
[ ] React and ActionCable
[ ] What’s Next
11. Managing State in Stimulus Code
[ ] Using Data Values for Logic
[ ] Observing and Responding to DOM Changes
[ ] Rendering CSS with Data Attributes
[ ] What’s Next
12. Managing State in React
[ ] Using Reducers
[ ] Using Context to Share State
[ ] Adding Asynchronous Events to Contexts
[ ] What’s Next
13. Using Redux to Manage State
[ ] Installing and Using Redux
[ ] Adding Asynchronous Actions to Redux
[ ] What’s Next
Part IV - Validating your code
14. Validating your code
[ ] Validating Code with Advanced TypeScript
[ ] Creating Union Types
[ ] Specifying Types with Literal Types
[ ] Using Enums and Literal Types
[ ] Building Mapped Types and Utility Types
[ ] TypeScript Configuration Options
[ ] Dealing with Strictness
[ ] What’s Next
15. Testing with Cypress
[ ] Why Cypress?
[ ] Installing Cypress
[ ] Configuring Cypress and Rails
[ ] Writing Our First Test
[ ] Understanding How Cypress Works
[ ] What’s Next
16. More Testing and Troubleshooting
[ ] Writing More Cypress Tests
[ ] Testing the Schedule Filter
[ ] Cypress and React
[ ] Cypress Utilities and API
[ ] Troubleshooting
[ ] What’s Next
A1. Framework Swap
[ ] The All-Hotwire App
[ ] The All-React App
[ ] Comparison