Fresh Resources for Web Designers and Developers (March 2020)
It’s time again for us to share fresh resources with our fellow web developers. In this round, we have some great new tools from big names in the tech industry, including Microsoft, GitHub, and JetBrains.
We also have several high-quality JavaScript libraries for creating flowcharts, data grids, and calendars, as well as a PHP library that simplifies HTTP requests. So without further ado, let’s jump in to see the full list.
Click Here for More Resources
Check out our complete collection of hand-picked tools for designers and developers.
Jetbrains Mono
A monospace type font created by JetBrains. The font is designed for developers and provides a better reading experience when working within code editors. JetBrains Mono comes with 4 weights and more than 100 code-specific ligatures like => and ===, and best of all, it’s FREE.
Zttp
Zttp is a library for making HTTP requests with PHP. It’s essentially an abstraction layer for Guzzle, which is a robust and powerful library for dealing with HTTP in PHP that can be overwhelming to use. Zttp makes it easier and more straightforward for 90% of use cases.
Solid.js
A JavaScript library for creating user interfaces. Unlike some popular libraries in this niche like React.js, it does not use Virtual DOM. Solid.js compiles code to native DOM nodes, which makes it run fast. Yet, despite relying on native DOM, it also provides modern features that make it enjoyable to work with, such as State and JSX.
Flowy
Flowy makes creating flowcharts easy. You can simply drag and drop blocks, move them up or down, and left or right to arrange the flowchart. It has a nice-looking UI, works well on mobile, and is responsive and customizable at the code level with the API and Callback Functions.
Playwright
A new open-source initiative from Microsoft, Playwright is an automation tool for browser testing. It runs tests in real browsers such as Chrome, Firefox, and WebKit-based browsers, and performs a series of actions that you define. It’s a great tool to check if a particular feature works as expected when your users are using it.
CSS Cascade
CSS Cascade is an in-depth article on how Cascading works in CSS. It’s quite informative for any designer or developer who wants to get into or fill in the gaps in their CSS knowledge base.
Awesome CSS Houdini
Another cool thing coming to CSS is CSS Houdini. Usually, a new feature in CSS can take a very long time to be applicable in browsers; it can take a few years or even a decade.
CSS Houdini specification focuses on addressing this issue. It allows you to create custom features that will apply to CSS by leveraging the browser API, and you can manage it to work across different browsers.
Neumorphism
A handy tool for creating neumorphism user interfaces with CSS. You can pick a color, adjust the shadows, the shape, and it will generate the CSS code to copy.
Pasteboard Viewer
Pasteboard Viewer is a utility app that makes it convenient for developers to ensure that their app is putting the correct data on NSPasteboard. The app refreshes the pasteboard contents live and can preview text, RTF, and images. Another great app from Sindre Sorhus.
Critic.sh
Critic.sh is a small library that allows you to test your Bash scripts. Like a Testing Framework, you can perform assertions to check whether your function returns the expected result or works as expected.
GitExplorer
GitExplorer helps you to find the right Git commands in the most intuitive way. It provides a couple of options where you can select the command and the context or scenario to run the command. For example, if you select clone and submodules after cloning the existing repo, it will generate git submodule update --init --recursive.
Windows Terminal
A Terminal application is coming to Windows. Microsoft has recently announced its latest version with bug fixes and new features. With this Terminal app, you can run scripts in various Shell environments including the PowerShell or the Windows Linux Subsystem such as Debian and Ubuntu.
Github CLI
GitHub has recently announced its official CLI. This allows you to manage your GitHub repositories from the Terminal, which means you can possibly automate a few other things too. You can perform tasks that you would usually do from their website, such as creating a Pull Request (PR), an Issue, and checking their status.
FullCalendar
A JavaScript library to create a full-fledged calendar. FullCalendar can render a calendar similar to what we see in Google Calendar but comes with more features and high customizability. Developers can easily incorporate it with popular frameworks such as React.js, Vue.js, and Angular.
Aos
A JavaScript library to animate content as it appears in the viewport. It runs on Vanilla JavaScript without any external dependencies. Aos is shipped with an API in the form of JavaScript and HTML, which makes it quite flexible to integrate with any type of website.
Handsontable
An advanced JavaScript library to create a data grid that looks and feels like a spreadsheet. It provides an API that allows you to perform data binding, data validation, filtering, sorting, and CRUD operations quite easily. It’s also compatible with popular frameworks like Vue, React, and Angular.
Must Watch JavaScript
A collection of talks about JavaScript. It covers topics such as ES6, frameworks, client-side applications, JavaScript performance, tooling, and more. A great free source to brush up on your JavaScript skills.
HeroIcons
A collection of icons in SVG format. It comes with two styles – solid style and outline style. Each of these styles consists of 140 icons and more to come to the collection. As these icons are SVG, they can be resized to any size without losing quality.
SceneJS
Scene.js is a JavaScript library to create animations with a CSS-based timeline. It’s a perfect library if you’re already familiar with CSS animation and want to apply it with the dynamic language of JavaScript.
OpenPeeps
A collection of elements like arms, hair, clothes, accessories, and facial expressions made of SVG. You can mix all these elements to create characters with various personas.
It also provides pre-made combinations of these elements in PNG and SVG that you can download for free. This collection is a time-saver for both designers and developers if you need to add characters to your website or web application.
