Being a developer is difficult. Most of the learning you do in school doesn’t apply to the career you will have in the future. The skills you have today will become obsolete. The training you receive at your company wont prepare you for all that is necessary in completing certain tasks. However the greatest difficulty is the way we think about ourselves.

Solving Problems

Before talking about the dreaded imposter syndrome lets talk about solving problems. …

React state management is a broad topic, and choosing the right management tool is often difficult. React is known for its missing state management tool often leaving it to the developer to figure it out. However, over the years, some great tools have emerged giving the developer some powerful features.

This article we will use Recoil to build an alert component, but you can apply the same principles in any state management tool you choose.

If you want to just jump into the code here is the repo for the whole project:

Setup

I will be starting the project from a starter project I created called, Next.js Tailwind CSS Starter. …

My story is as follows. I was on the Tailwind CSS website the other day, and I noticed they have an awesome auto coder pad on their main page. As the auto coder pad types it changes the css so you can see how to use Tailwind CSS to create styled components. So naturally I wanted to add it on my entry level developer training website.

When I first started to think about how to do this I first went to NPM to see what packages I could use to highlight the code for me.

I decided to use Highlight.js along with React Highlight.js which is a light wrapper around the library. …

In this article we will go over how to create a confirm dialog using React and Tailwind CSS. This article will roughly go over the logic in my other article, Creating a Confirm Dialog in React and Material UI, however this article will use Tailwind CSS.

There comes a time in every application where you want to delete something. So like every developer, you add a button, that when clicked on, deletes the resource.

Wether it’s a blog post, a shopping cart item, or disabling an account, you want to protect against unwanted button clicks.

Enter the Confirm Dialog.

Sometimes you do want to execute an action without always prompting the user with a confirm dialog, and sometimes it can be annoying always prompting them. …

In the world of web design, CSS breakpoints help us design a more robust, responsive website, detecting when to show and hide certain elements, resizing components to fit, or stretch on mobile devices, achieving a smooth user experience.

In this article we will discuss how to use CSS breakpoints in Material UI.

Here is the example Github repo we will be using if you just want to dive into the code. You can view the Readme to get started.

What is a CSS breakpoint?

A breakpoint is defined in CSS when it detects certain screen sizes, and when the defined breakpoint is hit it will then show appropriate content for that screen size. For instance, on a desktop browser you have plenty of room to show large and wide elements, however, on a mobile device you have to plan out what you absolutely need to show and what will decrease in size. …

Introduction

In this article we will discuss what an API is, what it means to be RESTful, and how to implement these using Node.js. The Node.js packages we will be using will be Express for our API endpoints and Sequelize to query our database.

Learning how to create an API is a delicate process. Developers just want to build endpoints fast, so they can quickly get something ready for a webpage to consume. However, learning how to make things RESTful will make your API more consistent, predictable, and scalable.

This article is assuming you know how to create an Express server and connect to a database with Sequelize. …

JavaScript enables browsers on desktops and mobile devices to interactively engage with websites. The eco system of packages and frameworks enables developers to write code to better help developers. In recent years it has become popular to use JavaScript in places other than browsers.

JavaScript has become the language of the internet. Anyone that has an idea, can quickly create, build, and deploy Full Stack applications by using JavaScript.

Full Stack means that we are creating, building, and deploying, services on the browser, such as Chrome or Safari, and host back end servers that connect to database and process events.

Front End

• The look and feel of the application. …

Now that we have all become accustomed to working remotely, using chats, video conferencing, and screen sharing, we have been encouraged to share ideas, and with that, a need to create custom workflows.

In this article we will explore three popular technologies, Slack, Google Cloud Functions and NodeJS. Combining these technologies will improve our workflow in Slack.

To start we will go over how to create a Google Cloud Function. If you aren’t familiar with Google Cloud, I suggest trying it out for free.

To create a Google Cloud Function go to the Functions page:

• Click Create Function.
• Give it a name, such as alert-cpu. …