The best and worst thing about being a web developer is that the web is constantly changing. While this is exciting it also means that web developers must always be proactive in learning new techniques or programming languages, adapting to changes, and be willing and eager to accept new challenges. This could include tasks such as adapting existing frameworks to meet business requirements, testing a website to identify technical problems, or optimizing and scaling a site to better perform with the back-end infrastructure. I thought I would compile a comprehensive list of web development tools and resources that can help you be more productive, stay informed, and become a better developer.

Web Development Tools and Resources for 2019

A lot of these web development tools below are ones I use at My Website on a daily basis. I can’t include everything, but here are a couple of My favorites and other widely used ones. Hopefully, you find a new tool or resource that will aid you in your development workflow.

Note: The tools and resources below are listed in no particular order.

JavaScript Libraries

JavaScript is one of the most popular programming languages on the web. A JavaScript library is a library of pre-written JavaScript which allows easier access throughout the development of your website or application. For example, you can include a copy of Google’s hosted jQuery library by using the following snippet.

< script src = "https://ajax.googleapis.com/ajax/libs/jquery/2.2.0/jquery.min.js" ></ script >

jQuery: A fast, small, and feature-rich JavaScript library.

BackBoneJS: Give your JS app some backbone with models, views, collections, & events.

D3.js: A JavaScript library for manipulating documents based on data.

React: Facebook’s JavaScript library developed for building user interfaces.

jQuery UI: A curated set of user interface interactions, effects, widgets, and themes.

jQuery Mobile: HTML5-based user interface system designed to make responsive web sites.

Underscore.js: Functional programming helpers without extending any built-in objects.

Moment.js: Parse, validate, manipulate, and display dates in JavaScript.

Lodash: A modern utility library delivering modularity, performance, & extras.

Vue.js: An open source JavaScript framework used for building user interfaces.

Front-end Frameworks

Front-end frameworks usually consist of a package that is made up of other files and folders, such as HTML, CSS, JavasScript, etc. There are also many stand-alone frameworks out there. I am a big fan of Bootstrap and my website is built on it. A solid framework can be an essential tool for front-end developers.

Bootstrap: HTML, CSS, and JS framework for developing responsive, mobile first projects on the web.

Foundation: Family of responsive front-end frameworks that make it easy to design beautiful responsive websites, apps and emails that look amazing on any device.

Semantic UI: Development framework that helps create beautiful, responsive layouts using human-friendly HTML.

uikit: A lightweight and modular front-end framework for developing fast and powerful web interfaces.

Web Application Frameworks

A web application framework is a software framework designed to aid and alleviate some of the headache involved in the development of web applications and services.

Ruby: Ruby on Rails is a web application framework that includes everything needed to create database-backed web applications, with the MVC pattern.

AngularJS: Lets you extend HTML vocabulary for your web application. AngularJS is a framework, even though it’s much more lightweight and sometimes referred to as a library.

Ember.js: A framework for creating ambitious web applications.

Express: Fast and minimalist web framework for Node.js.

Meteor: Full-stack JavaScript app platform that assembles all the pieces you need to build modern web and mobile apps, with a single JavaScript codebase.

Django: High-level Python Web framework that encourages rapid development and clean, pragmatic design.

ASP.net: Free, fully supported Web application framework that helps you create standards-based Web solutions.

Laravel: A free, open source PHP web application framework to build web applications on the MVC pattern.

Note: I am a Laravel Expert.

Zend Framework 2: An open source framework for developing web applications and services using PHP.

Phalcon: A full-stack PHP framework delivered as a C-extension.

Symfony: A set of reusable PHP components and a web application framework.

CakePHP: A popular PHP framework that makes building web applications simpler, faster and require less code.

Flask: A microframework for Python based on Werkzeug and Jinja 2.

CodeIgniter: Powerful and lightweight PHP framework built for developers who need a simple and elegant toolkit to create full-featured web applications.

Task Runners / Package Managers

Tasks runners are all about automating your workflow. For example, you can create a task and automate the minification of JavaScript. Then build and combine tasks to speed up development time. Package managers keep track of all the packages you use and make sure they are up to date and the specific version that you need.

Grunt: JavaScript task runner all about automation.

Gulp: Keeps things simple and makes complex tasks manageable, while automating and enhancing your workflow.

npm: Pack manager for JavaScript.

Bower: A web package manager. Manage components that contain HTML, CSS, JavaScript, fonts or even image files.

webpack: A module bundler for modern JavaScript applications.

Languages / Platforms

Behind all the web development tools is a language. A programming language is a formal constructed language designed to communicate with a computer and create programs in which you can control the behavior. And yes I realize some of these might not always be referred to as a language.

PHP: Popular general-purpose scripting language that is especially suited to web development.

NodeJS: Event-driven I/O server-side JavaScript environment based on V8.

JavaScript: Programming language of HTML and the web.

HTML5: Markup language, the latest version of HTML and XHTML.

Python: a Programming language that lets you work quickly and integrate systems more effectively.

Ruby: A dynamic, open source programming language with a focus on simplicity and productivity.

Scala: Scala is a pure-bred object-oriented language allowing a gradual, easy migration to a more functional style.

CSS3: Latest version of cascading style sheets used in front-end development of sites and applications.

SQL: Stands for structured query language used with relational databases.

Golang: Open source programming language that makes it easy to build simple, reliable, and efficient software.

Rust: Systems programming language that runs blazingly fast, prevents segfaults, and guarantees thread safety.

Elixir: Dynamic, functional language designed for building scalable and maintainable applications.

TypeScript: Open source programming language that is a superset of JavaScript which compiles to plain JavaScript.

Databases

A database is a collection of information that is stored so that it can be retrieved, managed and updated.

MySQL: One of the world’s most popular open source databases.

MariaDB: Made by the original developers of MySQL. MariaDB is also becoming very popular as an open source database server.

MongoDB: Next-generation database that lets you create applications never before possible.

Redis: An open source, in-memory data structure store, used as a database, cache and message broker.

PostgreSQL: A powerful, open source object-relational database system.





As you can see there are lots of web development tools and resources available to help streamline your development workflow and hopefully aid you in being more productive. Again I can’t list every tool or resource in part 1, but if I forgot something important, feel free to let me know below in the comments. I will back with part two as soon as according to your suggestion.