Tips

How to Hide node_modules Folder in VS Code?

Pandiyan Murugan2 Comments

Introduction

If you’re working with Node.js, chances are you’ve encountered the node_modules folder. This folder is created when you install packages from NPM and can take up an incredible amount of space. To keep your workspace clean and tidy, you might want to learn how to hide the node_modules folder in Visual Studio Code. In this blog post, we’ll explain how to do it in three easy steps.

Step 1: Open Settings

The first step is to open the settings in Visual Studio Code. You can do this by clicking on the gear icon in the bottom-left corner of the sidebar.

Step 2: Find Files Exclude

Once you open the settings, you’ll need to find the Files: Exclude section. This section allows you to hide certain files and folders from the Explorer view.

Step 3: Add node_modules

The final step is to add the node_modules folder to the list of excluded files and folders. To do this, you’ll need to type in the name of the folder in the text field. Once you do that, the node_modules folder will no longer appear in the Explorer view.

Conclusion

That’s all you need to know about hiding the node_modules folder in Visual Studio Code. It’s a simple process that can help you keep your workspace uncluttered and organized. Give it a try and see how it works for you!

Happy Coding!

How to Center a Div Using CSS

Pandiyan MuruganLeave a comment

Introduction

Do you want to learn how to center a div using CSS? Centering elements on a web page is a common design feature, and mastering the technique can help you create a professional-looking website. In this blog post, we’ll discuss how to center a div using the margin and transform properties.

Margin Property

The margin property is the most common way to center a div. You can use the auto value for the left and right margins to make the div center itself. Here is an example of the margin property in action:

div {
    margin-left: auto;
    margin-right: auto;
}

Transform Property

The transform property is a newer way to center a div. It works by translating the div to the center of the page. Here is an example of the transform property in action:

div {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

Flexbox

Flexbox is another way to center a div. It is a powerful tool that allows you to align and order elements on a page. To center a div using flexbox, you can use the justify-content and align-items properties. Here is an example of flexbox in action:

div {
    display: flex;
    justify-content: center;
    align-items: center;
}

Conclusion

Centering a div is a common design feature, and there are several ways to do it. The most common way is to use the margin property, but the transform and flexbox properties can also be used. With some practice, you can master the technique and create a professional-looking website.