A .gitignore file tells GitHub which files to skip when uploading your project. You create it directly on GitHub by adding a new file named .gitignore, then list patterns like *.env or node_modules/ so those files never appear in your repository. GitHub even provides ready-made templates for common frameworks.
Why Hiding Files From GitHub Matters
When you push a project to GitHub, every file in the repository becomes visible — including files that contain passwords, API keys, or bulky dependencies. A .gitignore file is a simple text file that lives at the root of your repository and tells Git which files or folders to ignore. Any file matching a pattern in .gitignore will not be uploaded to GitHub.
Important concepts before we start:
- **Patterns** work like filters. Writing `*.env` means 'ignore every file ending in .env.' Writing `node_modules/` means 'ignore the entire node_modules folder.' - **.gitignore only prevents future uploads.** If a file is already in the repository, adding it to .gitignore later will not remove it from history. You must delete the file from the repo separately. - **GitHub templates** are pre-built .gitignore files for popular languages and frameworks (Node, Python, React, etc.). They save you from writing patterns manually.
This guide walks you through creating a .gitignore file entirely in the GitHub web interface — no terminal or command line required.
Prerequisites
- A GitHub account (free tier works)
- An existing repository or the ability to create one
- Basic understanding of what a repository is
Step-by-step guide
Open your repository on GitHub
Open your repository on GitHub
Navigate to github.com and sign in. Click your profile picture in the top-right corner, then select **Your repositories** from the dropdown menu. Click the name of the repository where you want to add the .gitignore file. You will land on the repository's main code page, which shows all your current files and folders.
Expected result: You see the file list for your repository with a green 'Code' button near the top-right.
Create a new .gitignore file
Create a new .gitignore file
Above the file list, click the **Add file** dropdown button, then select **Create new file**. In the 'Name your file' text box at the top, type `.gitignore` (include the dot at the beginning — this is important). As soon as you type this exact name, GitHub may show a banner suggesting a .gitignore template. If you see it, click **Choose a .gitignore template** and pick the one closest to your project (for example, 'Node' for a JavaScript project built with tools like Lovable or V0).
Expected result: The file editor opens with .gitignore as the filename and optionally pre-filled template content.
Add patterns for files you want hidden
Add patterns for files you want hidden
In the file editor, add one pattern per line. Here are the most common patterns you should include: - `.env` — hides your environment variables file - `.env.local` — hides local overrides - `node_modules/` — hides installed dependencies (they can be thousands of files) - `.DS_Store` — hides macOS system files - `dist/` — hides build output - `*.log` — hides log files You can add comments by starting a line with `#`. For example: `# Ignore environment files`.
1# Environment variables2.env3.env.local4.env.production56# Dependencies7node_modules/89# Build output10dist/11build/1213# OS files14.DS_Store15Thumbs.db1617# Log files18*.log19npm-debug.log*Expected result: The editor shows your .gitignore patterns, one per line.
Commit the .gitignore file
Commit the .gitignore file
Scroll down to the **Commit changes** section. In the commit message box, type something descriptive like 'Add .gitignore to hide sensitive files.' Leave the radio button set to **Commit directly to the main branch**. Click the green **Commit changes** button. GitHub saves the file immediately to your repository.
Expected result: You are taken back to the file list and .gitignore appears among your repository files.
Delete any sensitive files that were already committed
Delete any sensitive files that were already committed
If a sensitive file (like .env) was already uploaded before you created the .gitignore, it is still in the repository. Navigate to the file by clicking its name in the file list. Click the **three-dot menu** (⋯) in the top-right corner of the file view, then select **Delete file**. Add a commit message like 'Remove .env file — already in .gitignore' and click **Commit changes**. Repeat for any other sensitive files. Note: The file will still exist in your repository's commit history. If it contained real API keys or passwords, rotate those keys immediately.
Expected result: The sensitive file no longer appears in the current file list, and future uploads will be blocked by .gitignore.
Complete working example
1# Environment variables — NEVER commit these2.env3.env.local4.env.development5.env.production6.env*.local78# Dependencies9node_modules/10.pnp/11.pnp.js1213# Build output14dist/15build/16.next/17.vercel/1819# OS files20.DS_Store21Thumbs.db2223# IDE files24.vscode/25.idea/26*.swp2728# Log files29*.log30npm-debug.log*31yarn-debug.log*32yarn-error.log*3334# Test coverage35coverage/Common mistakes when hiding Sensitive Files From GitHub Using .gitignore
Why it's a problem: Forgetting the dot at the beginning of .gitignore
How to avoid: The filename must be exactly .gitignore with a leading period. Without the dot, GitHub will not recognize it.
Why it's a problem: Adding .gitignore after sensitive files are already committed
How to avoid: .gitignore only prevents future uploads. Delete already-committed sensitive files manually and rotate any exposed keys.
Why it's a problem: Using wrong path separators
How to avoid: Always use forward slashes (/) in .gitignore patterns, even on Windows. Backslashes will not work.
Why it's a problem: Ignoring the node_modules folder but not dist/build folders
How to avoid: Both should be ignored. Build output can be regenerated and does not belong in the repository.
Best practices
- Always create .gitignore before your first commit to prevent accidental uploads.
- Use GitHub's built-in .gitignore templates as a starting point for your language or framework.
- Add comments with # to explain why each pattern exists — future collaborators will thank you.
- Never store API keys, passwords, or tokens in files that are tracked by Git.
- Review your repository files after creating .gitignore to ensure nothing sensitive slipped through.
- If you use an AI builder like Lovable or V0, check what files the export includes and add appropriate ignore patterns.
- Keep .gitignore organized by category: environment, dependencies, build output, OS files.
Still stuck?
Copy one of these prompts to get a personalized, step-by-step explanation.
I have a GitHub repository for a React project. Generate a comprehensive .gitignore file that covers environment variables, node_modules, build folders, OS files, and IDE files. Explain what each pattern does.
Frequently asked questions
Does .gitignore delete files that are already on GitHub?
No. The .gitignore file only prevents future uploads. Files already committed to the repository remain in the history. You must manually delete them from the repository and rotate any exposed credentials.
Can I have multiple .gitignore files in one repository?
Yes. You can place a .gitignore in any subdirectory, and it will apply to that directory and its children. However, most projects only need one .gitignore in the root folder.
What is the difference between .gitignore and .env?
A .env file stores environment variables like API keys and passwords. The .gitignore file tells Git which files to skip during uploads. You add .env to your .gitignore so that your secrets never reach GitHub.
Will .gitignore work if I use GitHub Desktop instead of the web interface?
Yes. GitHub Desktop respects the .gitignore file. Any file matching a pattern in .gitignore will not appear in the 'Changes' tab of GitHub Desktop.
How do I ignore a folder but keep one file inside it?
Add the folder to .gitignore (e.g., logs/) and then add an exception on the next line with a ! prefix (e.g., !logs/.gitkeep). The exception tells Git to track that specific file.
Can RapidDev help if I accidentally pushed sensitive data to GitHub?
Yes. RapidDev's engineering team can help you clean repository history, rotate compromised credentials, and set up proper .gitignore files to prevent future leaks.
Talk to an Expert
Our team has built 600+ apps. Get personalized help with your project.
Book a free consultation