Community Picks·3yJavaScript Playground – A no-fuss pure JavaScript playground with a live feedback loop
JavaScript Playground is a small web application that provides a JavaScript playground for free. You can think of it as a tiny editor for you to quickly test any JavaScript supported by your browser. It functions pretty much like a REPL, where you are given immediate feedback on the Console screen as you change your code.
freeCodeCamp·3yHow to Write Faster HTML and CSS Code Using Emmet
Emmet is an essential development tool that helps you quickly create repetitive structures like lists, tables, or ordered elements with minimal typing. It is more like a shorthand that translates to multiple lines of HTML or a CSS attribute. In this tutorial, we will learn some Emmet shortcuts that generate HTML and CSS quickly.
freeCodeCamp·3yHow to Use the JavaScript Fullscreen API
Fullscreen API is a browser web API that allows you to enable fullscreen mode for HTML elements. It saves you the stress of using CSS and JavaScript to implement fullscreen functionality. The use cases of fullscreen API are numerous because of the increased complexity of today's websites.
asayer·3yMobile-first approach with HTML and CSS
The mobile-first approach is a design and development approach focusing on creating a user-friendly experience for mobile devices like smartphones and tablets. This article will explain the principles and benefits of mobile- first design and implementing specific strategies with HTML and CSS so you can apply the methodology.
asayer·3yCSS wrapping made easy
CSS wrapping may be relied on when it comes to regulating how items are displayed and wrapped within a container. It emphasizes content readability and adaptability to any screen size, particularly smaller screens. CSS has several properties for managing how to make text wrap; the two most common properties are and.
Semaphore·3yCreating SVG Animations Using Tailwind CSS
SVGs are a vector-based graphics file format that allows graphics to be displayed at any size without losing quality. For the use of illustrations, icons, and logos on websites and applications, SVGs have proven to be an invaluable resource. For this tutorial, we will use a heart SvG icon from Hero icons.
Community Picks·3yVrite Editor: Open-Source WYSIWYG Markdown Editor
Vrite Editor is an open-source, minimalistic WYSIWYG Markdown editor to easily create and export Markdown and HTML content on the go. Vite Editor comes with many features to make editing a breeze. TipTap provides extensions for supporting Table formatting, the UI is a different story.
Community Picks·3yNext.js App Router
Next.js App Router implements React Server Components, a new feature introduced in React 18. To support the App Router, currently all components and hooks from MUI libraries are exported with the directive. Using Material UI with the default theme, you can add Material UI components to Next.js routing files without any additional configuration.
freeCodeCamp·3yWhat is NodeJS? The JavaScript Engine and Runtime Explained for Beginners
JavaScript is a programming language based on the ECMAScript language standard. It's not a language or a framework. It's simply an environment that allows you to write JavaScript that interacts with different parts of the outside world. The JavaScript engine still implements specific rules, ensuring consistency when executing your code.
Product Hunt·3yDoppio - HTML to PDF/Image API
Doppio.sh is a collaborative approach and understands the value that comes with different perspectives. We're particularly interested in your thoughts on our Product Experience, Pricing, Branding, and Documentation. We're eager to hear your thoughts and feedback.
freeCodeCamp·3yHow to Build Error-Free HTML Forms
When I first started creating HTML forms, I would often use as the label and id's attribute. This all changed when I started using WAVE’s accessibility checker to learn how to make my code more accessible. In this article, I will show you three things I have learned in surviving, I mean making HTML forms error-free.
Deno·3yDeno 1.35: A fast and convenient way to build web servers
Deno 1.35: A fast and convenient way to build web servers is now stable. This release also includes many other improvements and bug fixes. The long awaited new web server API, which allows developers to set up a web server using a single line of code.
Community Picks·3yHono + htmx + Cloudflare is a new stack
Hono JSX Middleware Hono- a JavaScript framework for edges - includes JSX middleware. Hono's Zod Validator Middleware integrates with Hono, allowing us to easily get the types of validated values. It’s already fast and perfectly suitable for Proof of Concept (PoC) projects.
Hacker Noon·3yHow to Create a Personal WebDev IDE in Next.js
We'll explore the process of building a functional web development Integrated Development Environment (IDE) using React within a Next.js application. We'll focus on creating an IDE that offers support for HTML, CSS, and JavaScript. Subsequently, we'll enhance the IDE by adding the capability to execute our code.
Hacker Noon·3yUnderstanding the Differences Between Real DOM, Virtual DOM, and Shadow DOM
The HTML tree of a website is represented by an object called. In this object, there is a model of the HTML tree's elements, conveniently accessible by. DOM (Document Object Model) document object dot notation. You can also use this dot notation to manipulate the DOM.
This is Learning·3yTop 20 Must-Know Tips for Web Accessibility
We'll uncover the secrets of creating clear descriptions for images, explore the world of navigating using only the keyboard, and much more, so that everyone can browse your site like a pro. This third part of the series aims to provide you with essential principles (not all of them), practical advice, and examples for creating accessible websites.
This is Learning·3yQwik – The Post-Modern Framework
Qwik is based on the HTML first framework's philosophy: make the fastest possible time-to-interactive (to do it faster by doing nothing) The framework delays the invocation of the javascript as much as possible and invokes it only what is absolutely needed. The focus is on the first load.
freeCodeCamp·3yHow to Manipulate HTML and CSS Using JavaScript
The HTML DOM (Document Object Model) represents the structure and content of an HTML document as a tree-like structure. In it, each element, attribute, and text node is represented as a node in the DOM tree. In this article you're going to learn how to use that structure to more effectively control the way your HTML elements behave.
freeCodeCamp·3yHow to Start Learning JavaScript
JavaScript is a powerful programming language that provides significant value in web development. There isn't any technical connection between JavaScript and the Java programming language. In this article I'm going to show you how you can incorporate JavaScript into your HTML code. You can include JavaScript code in your HTML web pages in a couple ways.
freeCodeCamp·3yHow to Use CSS Selectors
CSS selectors target HTML elements based on their tag names, attributes, classes, IDs, or their position in the document structure. The shape of the background coloring applied to tags and the border color of the text input field are controlled by these two styles. You can also control content behavior using custom or styles, pseudo classes, and inheritance.
Syncfusion·3yThe Power of React’s Virtual DOM: A Comprehensive Explanation
The Power of React's Virtual DOM: A Comprehensive Explanation Modern JavaScript frameworks have entirely changed the way web development is done. They have provided a great abstraction by addressing common issues in browsers and enhancing performance using methodologies that were not possible through plain JavaScript. This article will discuss the virtual DOM and how it works.
