Our great sponsors
-
-
-
SurveyJS
Open-Source JSON Form Builder to Create Dynamic Forms Right in Your App. With SurveyJS form UI libraries, you can build and style forms in a fully-integrated drag & drop form builder, render them in your JS app, and store form submission data in any backend, inc. PHP, ASP.NET Core, and Node.js.
-
-
-
-
WorkOS
The modern identity platform for B2B SaaS. The APIs are flexible and easy-to-use, supporting authentication, user identity, and complex enterprise features like SSO and SCIM provisioning.
Next.js is a React framework from Vercel that makes creating high-quality apps incredibly simple. With built-in support for server-side rendering, file-based routing and a huge store of examples on GitHub, it's a great way to start building your first JavaScript website.
PostCSS is a tool that exposes your CSS styles as an API for manipulation by a vast array of specially-designed plugins.
Tailwind CSS is a specialised framework for styling websites. When I started developing web apps, I wondered how I would turn my designs into interactive components. Then I discovered Tailwind, a utility-first tool that provides a number of preset CSS classes that can be used to style your app. It adds a bit of quality to your app and integrates easily with Next.js.
Jest is a testing tool for JavaScript. If you've never tested your code before, Jest is one of the best ways to get started. Testing is definitely worthwhile, as it enforces stability and confidence in your code, and Jest's prevalence in web development makes it a popular topic on Stack Overflow. Which always helps.
One such plugin is Autoprefixer, which handles the addition of browser prefixes to your stylesheets. While browsers largely follow the same CSS standards, there are still variations in the implementation of those standards, particularly if they are experimental. You may have seen code such as the below before:
Using your preferred terminal (I use iTerm2), navigate to the place you store your projects and type the following command:
If, however, you want to skip that part and simply head straight to the coding, you can use my template project with Next.js, Tailwind and Jest already set up to hit the ground running.