Best of Web DevelopmentMarch 2024

  1. 1
    Article
    Avatar of devtoDEV·2y

    Build an awesome developer portfolio website.

    Learn how to build an awesome developer portfolio website using Next, Tailwind CSS, and EmailJS. Step-by-step guide on setup process and GitHub link.

  2. 2
    Article
    Avatar of devtoDEV·2y

    2024 Cheat Sheet Collection

    A collection of cheat sheets for developers that provide concise reference guides for various programming languages, including CSS Grid and Flexbox. Also includes recommendations for comprehensive cheat sheet collections.

  3. 3
    Article
    Avatar of communityCommunity Picks·2y

    JavaScript (JS) Cheat Sheet Online

    Interactive JavaScript Cheat Sheet with code examples covering basics, loops, conditionals, variables, data types, strings, events, numbers, dates, arrays, global functions, regular expressions, errors, JSON, and promises.

  4. 4
    Article
    Avatar of devtoDEV·2y

    Useful CSS Tools

    Explore a curated list of CSS tools that can enhance your web design by simplifying the styling process and adding creativity and efficiency. This includes gradient generators, shadow creators, glassmorphism effects, sophisticated shadows, CSS scanning, animated hamburger icons, easing gradients, neumorphic design generators, CSS buttons, glow generators, and a CSS animation playground.

  5. 5
    Article
    Avatar of devtoDEV·2y

    Resources Every Web Developer Needs

    A post that provides a compilation of resources for web developers, including websites for learning web development, code editors to use, JavaScript animation libraries, and websites for vectors, images, and illustrations.

  6. 6
    Article
    Avatar of devtoDEV·2y

    Async vs Defer in JavaScript: Which is Better?🤔

    Learn about the async and defer attributes used when including external JavaScript files in HTML documents. Understand their differences, how they affect script execution, and when to use them.

  7. 7
    Video
    Avatar of communityCommunity Picks·2y

    world's shortest UI/UX design course

    Learn the fundamentals of UI and UX design, including user flow, wireframing, design systems, and more. Discover popular UI/UX design tools and how to create a consistent design with reusable components.

  8. 8
    Article
    Avatar of communityCommunity Picks·2y

    How to Build a Masonry Layout Using CSS

    Learn how to create a Masonry Layout using CSS by using the grid-template-columns function and the grid-column property.

  9. 9
    Article
    Avatar of devtoDEV·2y

    How to build a Good Portfolio Website - My Approach.

    Learn how to create a good portfolio website, including the importance of uniqueness, the benefits of having a portfolio, and the workflow for building one. The post provides insights on planning, designing, feedback, development, deployment, and resources.

  10. 10
    Article
    Avatar of freecodecampfreeCodeCamp·2y

    How to Build a Basic CMS with Google Sheets and React

    Learn how to build a basic CMS using Google Sheets and React. This approach reduces costs and simplifies content updates and management. Ideal for freelancers and those on a tight budget.

  11. 11
    Article
    Avatar of devtoDEV·2y

    The 9 types of Programmers in 2024

    Explore the different types of programmers in 2024 and their coding styles and personalities.

  12. 12
    Article
    Avatar of communityCommunity Picks·2y

    High Quality Open-Source Software for Web Developers

    An open-source React router with type safety, data fetching, caching, and search param APIs.

  13. 13
    Article
    Avatar of devtoDEV·2y

    Best Practices for Frontend Web Development: A Comprehensive Guide

    A comprehensive guide to frontend web development, covering best practices, including semantic HTML markup, CSS methodologies, responsive design, progressive enhancement, performance optimization, cross-browser compatibility, accessibility standards, optimized images and multimedia, version control, and continuous learning.

  14. 14
    Article
    Avatar of devtoDEV·2y

    3 Advanced Famer Motion Effects in React

    Learn how to create advanced animation effects in React using Framer Motion library.

  15. 15
    Article
    Avatar of devtoDEV·2y

    Tech Lead Software Setup - 2024 Edition

    The post discusses the author's software development setup for 2024. It includes recommendations for VSCodium, alternatives to Chrome, Safari, Firefox, Opera, Brave, and Epiphany browsers, and mentions Mistral-based models for AI.

  16. 16
    Article
    Avatar of hnHacker News·2y

    HeyPuter/puter: Desktop Environment in the Browser!

    Puter is an advanced open-source desktop environment in the browser that can be used as an alternative to cloud storage services, a remote desktop environment, and a platform for web development. It is built with vanilla JavaScript and jQuery.

  17. 17
    Video
    Avatar of communityCommunity Picks·2y

    4 UI Design Tools I Can't Live Without

    Discover four design resources that can help you create beautiful web applications. Learn about tools for creating SVGs, finding color palettes, and improving animations on your website.

  18. 18
    Article
    Avatar of communityCommunity Picks·2y

    Building an adaptive favicon

    Learn how to build an adaptive favicon using SVG, which allows for scalability, small file size, and embedded styling for light and dark themes.

  19. 19
    Article
    Avatar of communityCommunity Picks·2y

    Top Headless UI libraries for React in 2024 | Blog

    Explore the top headless UI libraries for React in 2024, including Radix UI, Headless UI, React Aria, Aria Kit, Ark UI, and Reach UI. These libraries prioritize accessibility, customization, and scalability, offering distinct advantages for web development and inclusive design practices.

  20. 20
    Article
    Avatar of devtoDEV·2y

    Desert Racer 🏜️: World's First CSS-only Swipe-Aware Game!

    A CSS-only game showcasing swipe awareness and collision detection using CSS tricks and scroll properties. The author challenges the notion that swipe awareness is impossible without JavaScript and provides an interactive and inspiring experience.

  21. 21
    Article
    Avatar of communityCommunity Picks·2y

    Introducing Nue CSS

    Introducing Nue CSS, a scalable alternative to Tailwind, BEM, and CSS-in-JS. It offers a more maintainable and scalable way to write and structure CSS, making it easy to create consistent designs and simplify maintenance. Nue CSS aims to offload the burden from JavaScript developers and provide a clean separation of concerns for content creators, designers, and CSS developers.

  22. 22
    Article
    Avatar of css_tricksCSS-Tricks·2y

    The Power of :has() in CSS | CSS-Tricks

    Learn about the power of :has() in CSS, a pseudo-class that allows you to style elements based on their contents. Discover the syntax and examples of how to use :has() to enhance your web projects.

  23. 23
    Article
    Avatar of communityCommunity Picks·2y

    Tailwind CSS Animated

    Learn more about Tailwind CSS Animated and its benefits.

  24. 24
    Article
    Avatar of devtoDEV·2y

    Things I learned while building my JS library

    Learn about building a JS library, including considerations, bundling tools, important concepts for JS developers, and the benefits of building a library.

  25. 25
    Article
    Avatar of watercoolerWatercooler·2y

    Google New Look is Dope!

    Google has introduced a new look that is being praised for its awesomeness.