2.8 KiB
2.8 KiB
Table of Contents
- Front-end development practices
Front-end development practices
Goal of this session
We are reaching the end of our journey... Training can't teach you everything - you'll have to get your hands dirty to learn about front-end development. That being said, in this session we will try to look at all the moving pieces that are necessary to be dangerous in modern front-end development.
TypeScript
See TypeScript
Building a professional web app: topics
Dependency management: npm or yarn
- npm
- yarn
Testing
- jest
Code style
- prettier
- eslint
Security
- HTTPS
- CORS
- XSS prevention
- CSP
- OWASP
State management
- Redux (and redux-thunk, redux-saga, redux-observables). Also: General | Redux
- Mobx
useReducer,useContext,useState
Interaction with the backend
- GraphQL and Apollo
- redux-saga et al.
- Hooks for API handling
Error handling
- Error boundaries
CSS
- CSS-in-JS
- styled-components
- Emotion
Frameworks:
- Material UI
- Tailwind CSS
- CSS-first (no JS components) vs other frameworks
Developer experience
- Storybook
- Debugging with the React extension
- Performance and profiling
Building and deploying
Bundling
- webpack
- parcel
- rollup
Compiling
- babel
Deploying
- SSR vs. CSR vs. SSG
Monitoring
- Sentry
Performance
- Lighthouse
- Devtools
PWA (progressive web apps)
- Web Sockets
- Service Workers
- Payments
See also
See references in README.md, in particular: