Dev Things

Documents, Tutorials & resources

General

• Dev hints - Contains cheat sheets for multiple languages for a quick recap

Git

• Merge vs Rebase

Web

JavaScript

• This in JavaScript

CSS

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

Website Optimization

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

Favicons

• SVG icons with light & dark theme - YouTube tutorial

Static Site Generators

• Hugo Full Video Tutorial
• Jekyll Cheat sheet

Libraries & Packages

Web

Search

• Jets js - CSS based search engine for local site search

UI Frameworks

• Bootstrap - Responsive CSS framework.
• Tailwind - A utility-first CSS framework for rapidly building custom designs.
• MaterializeCSS - A responsive framework based on Material Design.

.NET

AI

• Microsoft Vision Skills - Profile containing packages for Microsoft Vision Skill packages.

Data Generators

• RandomDataGenerator - generator to create random data.
• SampleData - C# project code to generate predefined dummy data.
• DataGenerator - Generate primitive & smart random data.

Formatting data

• Humanizer - Manipulating and displaying strings, Enums, date, time, number and quantities into human readable form.

Loggers

• NLog - Popular logger for dot net.
• CSV Logger - Simple logger that logs into CSV file.

PDF

• iText - Create PDFs, Read chars from PDF, etc…

Code Samples

.NET

• ToDos - Various ToDo list backend API implementations in .NET Core

Tools

C#, .NET, Azure

CI/CD

• Cake - Build automation system with a C# DSL for tasks

Azure

• Azure App Service Migration Assistant - For publishing IIS website to App Service
• .NET upgrade assistant - For upgrading your project to newer version of .NET

Web

Performance

• Web hint - Website analyser from Microsoft and Open JS foundation.
• Google Page speed Insights - Analyse website performance
• web.dev - Measure - Similar to Page speed insights
• GT Metrix - Performance measurement tool
• Estimator Dev - Calculate the impact of switching to modern JavaScript syntax.

Monitoring

• Pulsetic

PWA

• PWA Builder - Create PWAs, publish it to app stores, etc…

Validators

• W3C | HTML Validator
• W3C | CSS Validator
• W3C | Atom/RSS Feed Validator

Market share Info

• Can I Use - Browser support for modern web technologies

Analytics

• Microsoft Clarity - Analytics, Heat maps & user behaviour
• Micro Analytics - Simple analytics with free plan
• Cloudfare Analytics - Basic Analytics with Web vitals & others

CSS Generators

• Bootstrap build - Bootstrap theme builder
• Glassmorphism - Generate CSS for glassmorphism effect

Converters

• JSON 2 TS - Generate TypeScript interfaces from JSON

General

• grep.app - Code search across public git repos

Low code

Application Builders

• Retool
• Amazon Honey code

Website builders

• Static.app
• Slides
• PageFabric - A windows drag and drop website builder

AI, ML

Training

Model builders

• Teachable machine by Google - Website to train AI for images, audio and poses and export AI models
• MS QnAmaker - Creating chatbots from documents

Dataset

• MS Trove - Images for machine learning models

Useful Extensions

GitHub

• All contributors - Recognise all contributors.
• GitHub Labeller - Manage GitHub labels via a YAML file.
• Label Commenter - Automatically perform actions such as commenting, closing, etc… on PRs and Issues when a label is applied or removed.
• Lock Threads - Automatically lock conversations on issues and PRs.
• ImgBot - Automatically compress all images in your repos.
• Misspell fixer - Automatically fixes typos and mistakes in your source code and docs.
• Pull - Keeps forks up to date.
• Prevent Public repos - Prevents all public repos in an org.
• Reactions - Deletes reaction comments and encourages use of GitHub reactions.
• Stale - Close Stale issues
• Unfurl Links - Add link previews to links in comments.

VS Code

Intellisence & Details

• Visual Studio IntelliCode - This extension provides AI-assisted IntelliSense by showing recommended completion items for your code context.
• GitLens - Provides info from Git details about when was the code last edited, who edited it, etc… Highly customisable.
• Version Lens - Shows the latest version for each package using code lens

Looks & personalization

• VS Code icons - New icons for file types and also for special folders in VS Code.

API Development

• OpenAPI (Swagger) Editor - OpenAPI extension for Visual Studio Code
• Thunder Client - A postman alternative for VS Code

Web Technologies

• Edge Debugger - MS Edge debugging tools within VS Code.
• HTML CSS Support - CSS Intellisense for HTML
• lit-html - Provides Syntax highlighting and intellisense for html code within Typescript or JavaScript.
• SVG Preview - Previewing SVG files

Content Writing

• Spell Right - Spell checker used for this website.

Others

• Code Snap - Take screenshots of your code
• Remote - WSL - This extension lets you use VS Code on Windows to build Linux applications that run on the WSL.
• SQL Server - A lightweight SSMS for VS Code.