Fresh Resources for Web Designers and Developers (May 2024)
As we move deeper into 2024, the web development community continues to push boundaries and create innovative solutions. This month’s collection showcases some remarkable tools and resources that have emerged from this vibrant ecosystem.
Click Here for More Resources
Check out our complete collection of hand-picked tools for designers and developers.
Deno Examples
Deno by Examples provides practical code samples for using Deno from the basic to advanced tasks, such as setting HTTP servers, handling JSON, processing forms, and server-side rendering with JSX. Each example includes clear, executable code snippets to help you get up to speed with Deno.
Solid Start
SolidStart is the official starter framework for SolidJS. It provides templates to quickly set up new applications with options like built-in server-side rendering, TypeScript support, Vite, Nitro, and Router. It makes it easier and faster build and running a site with SolidJS.
UseMods
UseMods offers a collection of utility functions for JavaScript. It includes functions for common tasks like formatNumber to make user-friendly format numbers, sum to calculate array of numbers, average to find the mean of an array. It’s overall a handy library to help you with various small tasks and functions needed to build modern web applications efficiently, whether it’s on the front-end or SSR.
FilamentPHP Fabricator
Fabricator is a FilamentPHP plugin that helps you create dynamic, block-based page layouts in their Filament applications. It allows you to easily create and manage content blocks through a user-friendly interface, making it simple to build complex pages or layout without needing extensive technical skills.
LM Studio
LM Studio is a desktop app for running Large Language Models (LLMs) like Llama, MPT, and StarCoder locally on your computer. It supports some common AI tasks like text embeddings and server-side completions. It’s user-friendly, works on Windows, macOS, and Linux. It is a suitable app for those who need to work offline for better privacy. Note that your computer will need a lot of RAM and a fast CPU to run this app effectively.
MUI-X
MUI X contains a collection of advanced React components such as DataGrid, Charts, and Date & Time Pickers. It helps you organize and display lots of data efficiently, with options like sorting, filtering, and even letting you export stuff to Excel. A perfect library to build complex data-driven applications.
Typebox
TypeBox is a library that lets you create JSON Schemas for TypeScript type checking and runtime validation, such as for validating data in REST and RPC services. This ensures your data structures follow defined types during development and in production.
Github Action Release
A GitHub Action for managing releases in Github. It runs on Linux, Windows, and macOS environments and allows you to easily configure various options for your release, such as uploading files, adding release notes, and more. This Action makes it easier to automate the release processes of your software.
Nest.js Boilerplate
NestJS Boilerplate includes features like authentication, database integration with TypeORM and Mongoose with support for PostgreSQL and MongoDB, mailing functionality, and i18n out of the box. It’s designed to streamline the development of typical NestJS projects by providing a ready-to-use setup with common functionalities so you can get your application up and running quickly.
Taxonomy
Taxonomy is an example of an application with Next.js. It includes the new /app directory, advanced routing with layouts and nested layouts, data fetching, and caching. This setup demonstrates the new capabilities and structure of Next.js, and is a great resource if you’re looking to learn and implement these features in your own projects.
Relative Time Element
The relative-time-element is a Web Component built by the team at Github. It is an upgrade to the standard time tag. It shows dates as local or relative times so users will see it in their own format and time zone. If JavaScript is off, the original date still shows up. This tool makes sure dates look right for everyone.
Dokku
Dokku is a free, open-source alternative to Heroku for managing apps. You can install it on any hardware and use cheap cloud providers to save money. You can simply push apps to it using Git, and they’ll run just like on Heroku, but on your own server.
Coolify
Coolify is a self-hosted alternative to Heroku, Netlify, and Vercel. It works with many programming languages and allows you to launch various applications on any server like a VPS, Raspberry Pi, or cloud services like EC2 and DigitalOcean. It provides automatic SSL certificate setup and Git integration with both hosted and self-hosted platforms including GitHub, GitLab, Bitbucket, and Gitea. This makes deploying your apps simple while giving you more control over the infrastructure.
Biome
Biome is a handy tool for web projects. It features a fast formatter and linter for JavaScript, TypeScript, JSX, JSON, and supports 97% of Prettier features. You can easily integrate it with VSCode to enable it to format and lint your code in real-time as you write, helping you improve your code quality.
GTS
Built by the team at Google, GTS is a collection of tools for TypeScript projects. It provides a style guide, formatter, and proofreader in one package. You don’t need to worry about configurations. Just install it in your project, and run gts fix, and your code will be clean and tidy. It helps you to catch mistakes early, saving time during code reviews.
LunarPHP
LunarPHP is an open-source package built with Laravel to build a headless e-commerce platform. It includes all the tools you need to manage your store, from catalogs to customers and orders, in a sleek and customizable admin area built with Laravel Livewire.
ArkUI
ArkUI is a library for creating customizable and accessible UI components. It’s designed to work with various JavaScript frameworks, so you can use it either with React.js, Vue, or Solid. On top of that, all the components start unstyled, so you can match them perfectly to your design.
OpenAI Cookbook
The OpenAI Cookbook provides example code and guides for using the OpenAI API to work on some common tasks. Most examples are in Python, but the principles can apply to any language. You can apply it using some of the SDKs available like openai-node or openai-php.
FrameworkX
Framework X makes asynchronous programming in PHP easy. It’s a fast and simple framework designed for creating reactive web applications with support for async and non-blocking execution. You can host it anywhere, even on shared hosting.
UI Lib Picker
UI Lib Picker is a handy tool for Vue 3 and Nuxt 3 users. It simplifies the process by offering an overview of various UI frameworks, making it easier for you to choose the one that fits your projects. It includes popular collections like NuxtUI, PrimeVue, and Vuetify, among others.
