Contribute

Help improving egytech.fyi

Thanks for helping making egytech.fyi better! We're happy to have you. Please follow the instructions below to setup your local development environment and get started. We strongly recommend that you check for open issues and pull requests to see if someone else is working on something similar.

Discuss your Thoughts

Before you fix a bug or work on a feature, please open an issue first to discuss it and confirm it's beneficial to the project. This helps saving the maintainers & contributors time and ensures faster approval for PRs.

Updating Content

For modifying or adding new content. You'll likely need to only do changes inside /app/content folder. See project structure for more info.

Content related PRs titles should start with docs: including typos fixes. For example: docs: fix typo, docs: add 2025 survey results

Tech Stack

Nuxt 3
TypeScript
TailwindCSS
Shadcn-Vue
Cloudflare Pages
🧩 Shadcn-Docs and Nuxt Content modules (See below for more info)

Prerequisites

Make sure the following are installed on your machine

Git.
Node.js LTS.
We recommend using nvm for installing different versions of Node.js and switching between them easily.
VSCode or your preferred IDE.
For VSCode, these extensions are recommended for better DX. Vue - Official, Tailwind CSS IntelliSense, ESLint, and Prettier - Code formatter.

Local Development

Clone the repo

terminal

git clone https://github.com/MuhammadM1998/egytech.fyi.git

Enable Corepack

terminal

corepack enable

corepack enable turns on corepack only for the current Node version. You'll need to run the command again if you switched to another Node version.

Install Dependencies

pnpm

pnpm install

We recommend using ni for unified commands for all package managers.

Start the Dev Server

terminal

pnpm dev

The app should be running on localhost:3000

Build Locally

You can build the project and preview it locally before submitting a PR to ensure everything is working as expected.

Build

pnpm

pnpm build

Preview

pnpm

pnpm preview

The generated build should be running on localhost:3000

Creating a new branch

Checkout to a new branch to implement your idea and test it locally.

terminal

git checkout -b my-branch

We recommend using Conventional Commits for more readable commits and easier reviewing. However it's not mandatory as we'll squash the PR and use the PR title as the message.

When you push your changes they get automatically formatted using a pre-commit hook using simple-git-hooks and lint-staged. We also use autofix.ci to lint & format PRs.

Submitting a PR

When you're confident your branch is working as expected without errors. Submit a PR and make sure its title is adhering to Conventional Commits as we squash the PR and use its title as the message for cleaner history.

We use amannn/action-semantic-pull-request to validate PRs titles.

Once your PR is merged. You're GitHub account will be featured in the project's README as a contributor! Powered by automd and contrib.rocks.

Project Structure

Below is an overview of the project structure with comments to clarify the folder/file scope.

./
├─ .github/ # GitHub composite actions, workflows, PRs & issues templates, etc.. 
├─ .vscode/ # Project settings & extensions for VSCode
├─ app
│  ├─ assets/
│  ├─ components/ 
│  │  ├─ content/ # Contains any components used in md files
│  │  ├─ global/ # Contains custom icons as vue files
│  │  │  └─ InstapayDuotone.vue
│  │  ├─ layout/ # Contains any components used in md files
│  │  └─ ui/ # shadcn-vue & our custom ui components
│  ├─ composables/
│  ├─ content/ # MD files for the website content.
│  │  ├─ 2024/ # Year folder. User can switch between the available years in the website
│  │  │  ├─ dashboard.md
│  │  │  └─ report.md
│  │  ├─ 2023/
│  │  │  ├─ dashboard.md
│  │  │  ├─ report.md
│  │  │  └─ extra-file.md
│  │  └─ community/ # Non year folder. Always visible no matter the selected year.
│  │     ├─ contribute.md
│  │     └─ participate.md
│  ├─ lib/ # shadcn-vue utils
│  ├─ pages/ 
│  └─ app.config.ts # Config for Shadcn-Docs module and our custom config
├─ public/
└─ components.json # Components config for shadcn-vue
└─ nuxt.config.ts
└─ tailwind.config.ts
└─ eslint.config.js
└─ .prettierrc
└─ .editorconfig
└─ .npmrc
└─ .gitignore
└─ package.json
└─ pnpm-lock.yaml
└─ README.md

Shadcn-Docs & Nuxt Content

This project utilizes Shadcn-Docs-Nuxt module for a beautiful & feature-rich documentation out of the box based on Nuxt Content. You'll likely need to refer their docs often while working on a feature.

Shadcn-Docs is in early development. If you encountered a bug. Consider submitting a PR upstream to Shadcn-Docs rather than this project. This benefits us and others using the module. Once its merged & released upstream we'll bump the module and get the newest updates.
If you have a change in mind that seems specific to this project. You can always override Shadcn-Docs components by creating a new .vue file with the same name. We're already doing this with the following files and others
- pages/[...slug].vue
- pages/index.vue
- components/layout/Header/Header.vue
- components/layout/Aside.vue
You can use Nuxt Devtools' inspect to easily open the component you need. You can also check Shadcn-Docs source.
Shadcn-Docs also exposes some shadcn-vue components such as Input, Button. Hence we don't need to re-add them in our project. If you added a new shadcn-vue component and got a warning in the console for duplicate components, this means the component is already added by Shadcn-Docs and you can use it directly without re-adding it.
For the components exported by Shadcn-Docs to work as expected. We must use the same shadcn.componentPrefix option in our nuxt.config as Shadcn-Docs which is Ui. Changing its value will break the components.

API Documentation

Access and test egytech api right in your browser.

Participate

Share your data to the initiative!

On This Page