Skip to content
docs-portal

docs-portal

๐Ÿš€ DevOps & Cloud Documents Portal is an open-source project providing one-click download for DevOps and Cloud documents.


๐Ÿ“Œ Table of Contents


๐Ÿ”น About This Project

This project provides DevOps & Cloud learning resources in a structured way, allowing users to search and download documents quickly.

โœจ Key Features:
โœ… Searchable 900+ DevOps & Cloud Documents ๐Ÿ“„
โœ… Fast downloads with clean UI โšก
โœ… GitLab CI/CD for automated deployment ๐Ÿš€
โœ… Open-source & community-driven ๐Ÿค


๐Ÿ“‚ Folder Structure

DOCS-PORTAL
โ”œโ”€โ”€ app
โ”‚   โ”œโ”€โ”€ globals.css               # Global styles (Tailwind base + custom CSS)
โ”‚   โ”œโ”€โ”€ layout.tsx                 # Root layout (sets up ThemeProvider, fonts, metadata)
โ”‚   โ””โ”€โ”€ page.tsx                   # Main homepage (renders Header, Search, Results)
โ”œโ”€โ”€ components
โ”‚   โ”œโ”€โ”€ DocCard.tsx                # Card component for displaying a document/resource
โ”‚   โ”œโ”€โ”€ explanation.tsx            # Small explanation block about the portal
โ”‚   โ”œโ”€โ”€ Footer.tsx                 # Footer with copyright
โ”‚   โ”œโ”€โ”€ Header.tsx                 # Site header with logo, title, and description
โ”‚   โ”œโ”€โ”€ loading.tsx                # Loading skeleton for lazy components/pages
โ”‚   โ”œโ”€โ”€ SearchResults.tsx          # Displays filtered search results
โ”‚   โ”œโ”€โ”€ search.tsx                 # Search bar with animation and debounce
โ”‚   โ”œโ”€โ”€ ThemeToggle.tsx            # Light/dark mode toggle button
โ”‚   โ””โ”€โ”€ ui                         # Reusable UI components
โ”‚       โ”œโ”€โ”€ button.tsx             # Styled Button component
โ”‚       โ”œโ”€โ”€ input.tsx              # Styled Input component
โ”‚       โ””โ”€โ”€ skeleton.tsx           # Skeleton loader UI
โ”œโ”€โ”€ data
โ”‚   โ””โ”€โ”€ files.json                 # List of all resource files with metadata (name, url, size)
โ”œโ”€โ”€ lib
โ”‚   โ””โ”€โ”€ utils.ts                   # Helper utility functions (e.g., formatting file sizes)
โ”œโ”€โ”€ providers
โ”‚   โ””โ”€โ”€ theme-provider.tsx         # Wrapper around next-themes provider for light/dark mode
โ”œโ”€โ”€ public
โ”‚   โ””โ”€โ”€ pdfs                       # Folder containing all uploaded PDF documents
โ”œโ”€โ”€ CHANGELOG                      # Version history and updates
โ”œโ”€โ”€ CODE_OF_CONDUCT.md             # Contributor behavior guidelines
โ”œโ”€โ”€ components.json                # (Optional) Component metadata/config (if used)
โ”œโ”€โ”€ CONTRIBUTING.md                # Contribution instructions for developers
โ”œโ”€โ”€ generateFilesList.js           # Script to auto-generate `files.json` from PDFs
โ”œโ”€โ”€ LICENSE                        # Open-source license for the project
โ”œโ”€โ”€ next.config.ts                 # Next.js configuration file
โ”œโ”€โ”€ next-env.d.ts                  # TypeScript environment settings for Next.js
โ”œโ”€โ”€ package.json                   # Project metadata and dependencies
โ”œโ”€โ”€ package-lock.json              # Lock file for exact versions of installed packages
โ”œโ”€โ”€ postcss.config.mjs             # PostCSS config for TailwindCSS and plugins
โ”œโ”€โ”€ README.md                      # Project documentation (you are updating this!)
โ”œโ”€โ”€ tailwind.config.ts             # TailwindCSS configuration
โ””โ”€โ”€ tsconfig.json                  # TypeScript compiler settings

๐Ÿ“Œ Main files:

  • index.js โ†’ Displays the UI for document search & download.
  • generateFilesList.js โ†’ Auto-generates files.json for document listing.
  • next.config.js โ†’ Handles URL rewriting & caching.

โš™๏ธ Installation & Setup

โœ… Prerequisites

๐Ÿ“Œ Ensure you have the following installed:

  • Node.js (>=18.x)
  • Git
  • Yarn or NPM

๐Ÿ“ฅ Clone the Repository

git clone https://gitlab.com/NotHarshhaa/docs-portal.git
cd docs-portal

๐Ÿ”ง Install Dependencies

npm install

๐Ÿ”„ Generate Files List

node scripts/generateFilesList.js

๐Ÿƒ Run Locally

npm run dev

๐Ÿš€ The portal should now be running at http://localhost:3000


๐Ÿš€ Deployment Guide

๐Ÿ”น Deploy via GitLab CI/CD

GitLab CI/CD automatically builds and deploys the site.

โœ… Steps:

1๏ธโƒฃ Push code to the main branch
2๏ธโƒฃ GitLab CI/CD runs build & deploy jobs
3๏ธโƒฃ Site is deployed via GitLab Pages

๐Ÿ“Œ If needed, modify .gitlab-ci.yml to customize builds.


๐Ÿ”„ Contributing

We welcome contributions! Follow these steps to get started:

1๏ธโƒฃ Fork the repository
2๏ธโƒฃ Create a new branch (feature-branch)
3๏ธโƒฃ Make changes & commit
4๏ธโƒฃ Push & create a Merge Request (MR)

๐Ÿ“œ Read the CONTRIBUTING.md for detailed guidelines.


๐Ÿ“œ License

This project is licensed under the MIT License.
See the full license here.


๐Ÿ’ฌ Community & Support

๐Ÿš€ Join our ProDevOpsGuy Tech Community:
๐Ÿ”น Telegram: @prodevopsguy
๐Ÿ”น GitHub: NotHarshhaa
๐Ÿ”น GitLab Issues: Report bugs & suggestions

๐Ÿ™Œ Happy Learning! ๐ŸŽ‰