Fresh Resources for Web Designers and Developers (June 2022)

A web designer/ developer should never run out of useful resources. So here we are with this month’s installment of fresh resources. In this round of the series, we are going to cover tools and resources of different areas in web development including design, frontend, backend, testing, architecting, and accessibility.

So whether you work as a full-stack developer, or have expertise in a specific area, I’m sure you’d appreciate the resources that we have on the list. Shall we?

Scribe

Documentation is critical to the success of the development process. Scribe helps to make it easier to create documentation for API endpoints. The documentation of each API can include the title, description, parameters, and more, which show the user how to use the API. Scribe is avaible for Laravel and Node.js.

MVP.css

MVP.css is a CSS library containing minimalistic styles for all the HTML elements. It does not contain classes, framework, or anything else. You just need to add the CSS file in the HTML file, and you’re all set. It’s a perfect library, if you’d like to get up and running a site quickly with some decent look.

Deno Fresh

Fresh is a framework to build web applications for Deno with a focus on simplicity and reliability. The framework features key architecture to build a web application such as Routing, Data Fetching, and Styling. Fresh is in active development, and I’m looking forward to see how it affects web development in the future.

TSX

TSX is a command-line utility to execute Node.js applications with TypeScript and ES Module (ESM) files. It’s using esbuild under the hood and supports new JavaScript extensions including .cts and .mts.

Turbo Solid

Turbo Solid is a JavaScript library that solves a lot of common problems when handling HTTP requests in dynamic React.js applications such as handling duplicated requests, caching, and synchronization, etc. This library allows you to be more productive instead of trying to solve these types of problems on your own.

ZSH Artisan

ZSH Artisan is ZSH shell extension for the artisan CLI in Laravel. It provides autocompletion and makes your CLI smarter.

TanStack

Built by Tanner Linsley, TanStack is a collection of tools and libraries to develop modern and dynamic websites. It includes TanStack Query to fetch, cache and manage server service states, TanStack Table to build advanced table or data grid, and a few more JavaScript libraries.

Ingradients

A collection of gradient colors by Gilbert Pellegrom as SVG, JPG, PNG, and as high as 6K resolution. You can find a perfect gradient for your next project; whether it’s for creating websites, flyers, mobile apps, wallpapers, or brochure.

Jest Preview

A utility plugin that allows you to preview HTML right within the tests. This allows you to see how the tests perform as well as how it affects HTML visually in the browser. In the end, this helps you to debug your application faster.

WAI Design Develop

A place to find detailed guidelines, tutorials, and examples around creating website components like forms, buttons, and tabs that adhere to the WAI accessibility standard. This is a great resource for website accessibility whether you’re an experienced developer or just getting started.

Password Evolved

A WordPress plugin that adds an extra layer of security to the website. First, the plugin will enforce users to not use uncompromised passwords found in Have I been pawned? data source. It will also encrypt the password using a more advanced hashing function like bcrypt and Argon2.

Pimcore

Pimcore is an all-in-one application to host and manage the digital experience. You can host almost any type of data regardless of the data modeling; whether it’s an eCommerce, blog, digital asset management, and a lot more. It’s built with PHP and can be easily installed through Composer.

The Power of JS Generators by Anjana Vakil

Anjan Vakil has been one of my favourite developers/speakers after the presentation on Functional Programming in JavaScript. In this lecture, Anjana brings something which is not yet well covered in JavaScript that is Generators.

If you want to widen your understanding of JavaScript, this is one of the presentations you should watch.

“Becoming a better developer by using the SOLID design”

SOLID is a well-proven development principle to create a robust softwared. In this talk, Katerina Trajchevska sheds light on the principle and provides some examples of the real problems in PHP that we could apply to solve the problem.

Flipper

Part of the Facebook Open-source Initiative, Flipper is a free tool that allows you to debug your mobile application. Similar to DevTools on the browser, you can inspect the elements and network requests from the desktop. It’s compatible with app built for iOS, Android, or using React Native.

Pint

Pint is a new code style fixer for Laravel. It’s an official library coming from the Laravel developer itself. It’s simple and, by default, does not require any configuration for Laravel projects. If your project runs on top of Laravel, you should definitely install Pint.

Docker with PHP

This PHP library allows you to manage Docker containers such as starting a container, executing commands inside the container, setting labels, setting volume, etc. A handy library if you’d like to manage stacks around Docker with PHP instead of using a different language.

Zustand

A JavaScript library for state-manager in React.js. The library aims for simplicity and solves some common issues when managing states and rendering React.js components. If you’re looking for a state manager for your React.js application with less of the headache, then this is probably what you need.

React PDF

A React.js library that makes it easier to create a PDF file with React.js component. You can add styles, text, and image, set the styles and you can choose whether you’d want to have it rendered on the browser or save it a file.