Here at Cyber Octane, we use following tools to optimize our day-to-day studio workflow.

Code Editors

Code editor is doing another big impact on our studio practice. After playing with different code editors in several years we have stick in to Visual Studio Code.

VS Code Plugins

• Live Server
• VScode Icons
• Beautify
• Bracket Pair Colorizer
• JS & CSS Minifier (Minify)
• Debugger for Chrome

VS Code Themes

• One Dark Pro

Front-End Development

As we highly concerning about pixel perfect designing we use & hope to use these tools to craft a stunning masterpiece.

HTML/CSS

CSS Frameworks

• Bootstrap - A free and open-source CSS framework directed at responsive, mobile-first front-end web development.

Tools

• HTML 5 Boilerplate
• Favicon Generator

Resources

• Media Queries for Standard Devices
• Frontend Dev Bookmarks - Manually curated collection of resources for frontend web developers.
• Design Resources for Developers - Manually Curated list of design and UI resources by Brad Traversy.

Javascript

UI Frameworks

• React - An open-source JavaScript library for building user interfaces, backed by Facebook.
• Vue.js - An open-source model–view–viewmodel JavaScript framework for building user interfaces and single-page applications.

Resources

• Awesome Javascript - A collection of awesome browser-side JavaScript libraries & resources.

JAMStack

Static Site Generators

• Hugo - A static site generator written in Go.
• 11ty

Back-End Tools

The back-end is basically how the site works, updates and dealing with databases and servers. Usually we people who work on the back-end are mostly worried about things like security, structure and content management. To do such things we use Python which is most trending on GitHub.

Python

Package Managers

• Pip - A standard package-management system used to install and manage software packages written in Python.

Python Frameworks

• Django - A Python-based free and open-source web framework that follows the model-template-view architectural pattern.

Resources

• Awesome Python - A curated list of awesome Python frameworks, libraries, software and resources.
• Awesome Django - A curated list of awesome Django apps, projects and resources.
• Awesome Django 2 - A curated list of awesome things related to Django.

In-Production

Module Loader/Bundler

• webpack

Task Runner

• Gulp

Additional Tools

Icon Packs

• Font Awesome
• Ionicons
• icons8

Static Site Form Handlers

Free

• Netlify Forms
• Static Forms
• Kwes Form Builder
• Formspree
• GetForm
• FormBackend
• FormPlug
• FormSubmit
• Formcake - Not mention any file uploading ability.

Paid

• formX
• Formcarry
• Basin
• FormKeep
• FieldGoal
• Form2chat

Free Stock Images/Illustrations

• DrawKit - A collection of free, beautiful, customisable MIT licensed illustrations.
• Unsplash - Free photos.

Color Inspirations

• COLOURlovers - A creative community where people from around the world create and share colors, palettes and patterns.

UI Inspirations

• Awwwards -
• CSS Awards - A web designer inspiration gallery, where a high quality of CSS websites placed from around the world.
• uplabs - A community of creatives, offering the best digital inspiration and downloads, every day.

GitHub Tools

• README-Template.md - A template to make good README.
• shields.io - GitHub legible badges in SVG and raster format.

Additional Resources

• Awesome List - A Curated list of awesome lists.
• free-for-dev - A list of SaaS, PaaS and IaaS offerings that have free tiers of interest to devops and infradev.
• List of Free Public APIs - A collective list of free APIs for use in software and web development.
• Free Programming Books - A list of freely available programming e-books.
• Frontend Developer Interview Questions - A list of helpful front-end related questions you can use to interview potential candidates, test yourself.