Web Technologies

Index

• Reads - Artciles, Tutorials, Videos, etc…
• Tools
• Libraries
  • UI Frameworks

Reads

CSS

• How to write truly terrible CSS - Freecodecamp
• CSS Naming Conventions - Freecodecamp
• A Primer to Well-Structured CSS

SVG

• Using SVG sprites over fonts for icons
• Optimising SVG for web use
  • Part 1
  • Part 2
  • Part 2.5

General

• Optimising a static site

Tools

PWA

• PWA Builder - Create PWAs, publish it to app stores, etc… Site performance
• Webhint - Website analyzer from Microsoft and Open JS foundation.
• Google Pagespeed Insights - Analyze website performance
• web.dev - Measure - Similar to Pagespeed insights
• GTmetrix Validators

• [W3C	HTML Validator](https://validator.w3.org/)

• [W3C	CSS Validator](https://jigsaw.w3.org/css-validator/#validate_by_uri)

• [W3C	Atom/RSS Feed Validator](https://validator.w3.org/feed/)

Others

• Can I Use - Browser support for modern web technologies

Libraries

UI Frameworks

• Bootstrap - Responsive CSS framework.
• MaterializeCSS - A responsive framework based on Material Design.
• Ant Design - Design system for enterprise applications.
• UI kit - Lightweight and modular frontend framework
• Spectre - A Lightweight, Responsive and Modern CSS Framework
• Tailwind - A utility-first CSS framework for rapidly building custom designs.