Index#
- Requirements clarifications/alignment(Functional and Non-functional)
- Scoping (MVP, features that one must have)
- Microinteractions in UI ( e.g
- button animations, form validation messages, hover effects, loading indicators etc.
- Multi-device support and web responsive design : Responsive Design Testing Tools; Mobile first design
- Choosing front end frameworks (React vs angular vs vue)
- HTTP vs HTTP2 vs HTTPS
- Cross-Browser Compatibility
- WebRTC (Real-Time Communication, real-time audio, video, and data communication, like video conferencing)
- Authentication and Authorization (JWT and o.Auth)
- Error Handling and Logging (Sentry and LogRocket)
Localization and internatinonalization : i18n#
- letting search engines know about another lang availablity (
<link rel="alternate" hreflang="hindi" href="http://hindi.example.com/page.html" />) Accept-Language header sent by client to server and accordingly server send the html- HTML document should also declare the lang attribute in the html tag, such as
<html lang="en">...</html>.
Web sockets, ajax polling, long polling, SSE#
Data :#
- Data API (like getPosts, createPosts)
- REST vs GraphQL
- Data Model Design
- Data store
- redux, mobx , vuex
- normalized for faster access
User Experience UX#
- ux tools: figma , adobe
- Design tokens
- Skeleton screens & shimmer loading effect
Testing :#
- Unit and integration testing (for angular- integration or e2e testing can be done by protractor; for react react-testing-library and cypress)
- Automotated Testing (Unit tests)
- Test high value features first
PWA mode#
- service worker an caching assets
- background sync
- push notification
Front-End Analytics and Tracking#
- google analytics
- insights into user behavior
CSS methodologies#
- BEM
- long selectors means more rendering time