An open API service indexing awesome lists of open source software.

https://github.com/noyonalways/tech-tips-hub-web

Tech Tips Hub Web UI
https://github.com/noyonalways/tech-tips-hub-web

Last synced: 5 months ago
JSON representation

Tech Tips Hub Web UI

Awesome Lists containing this project

README

          

[![Youtube][youtube-shield]][youtube-url]
[![Facebook][facebook-shield]][facebook-url]
[![Facebook Page][facebook-shield]][facebook-group-url]
[![Instagram][instagram-shield]][instagram-url]
[![LinkedIn][linkedin-shield]][linkedin-url]
[![VS Code Theme][vscode-shield]][vscode-theme-url]




Logo



TechTips Hub Web

## Description:

**TechTips Hub** is an advanced blogging platform tailored for tech enthusiasts to read and write blogs. Users can access both free and premium blogs, with a monthly subscription offering exclusive content. The platform supports features like user registration, email verification, JWT-based authentication, upvoting/downvoting blogs, commenting with replies, and following/unfollowing users. It tracks important user interactions such as views, followers, and following, enhancing the social experience.

### **User Features:**

- **User Registration & Login:** Secure registration and login using JWT-based authentication.
- **Email Verification:** Users must verify their email after registration to access full platform features.
- **Read & Write Blogs:** Users can publish their own blogs or read both free and premium content.
- **Upvote/Downvote Blogs:** Users can upvote or downvote blogs to show their preference.
- **Commenting & Replies:** Users can comment on blogs and reply to comments, fostering engagement.
- **Follow/Unfollow Users:** Users can follow or unfollow others, with tracking of followers and following counts.
- **Premium Content Subscription:** Access premium blogs with a monthly subscription.
- **View Tracking:** Track unique blog views while excluding the author’s views.

---

### **Admin Features:**

- **User Management:** Admins can manage user accounts, including viewing, editing, or suspending users.
- **Content Moderation:** Admins can monitor, approve, or delete blogs and comments to ensure community guidelines are followed.
- **Subscription Management:** Admins can manage user subscriptions, view active and expired subscriptions, and handle billing issues.
- **Analytics & Reporting:** Track platform engagement metrics like total views, user growth, upvotes/downvotes, and content performance.

### Tools and Packages

| Icon | Technology Name |
| ----------------------------------------------------------------------------------------------------------------------------------------- | --------------- |
| ![Next.js](https://img.shields.io/static/v1?label=&message=Next.js&color=black&logo=next.js&logoColor=white) | Next.js |
| ![React](https://img.shields.io/static/v1?label=&message=React&color=61DAFB&logo=react&logoColor=black) | React |
| ![TypeScript](https://img.shields.io/static/v1?label=&message=TypeScript&color=007ACC&logo=typescript&logoColor=white) | TypeScript |
| ![Axios](https://img.shields.io/static/v1?label=&message=Axios&color=5A29E3&logo=axios&logoColor=white) | Axios |
| ![React Hook Form](https://img.shields.io/static/v1?label=&message=React%20Hook%20Form&color=E3342F&logo=react-hook-form&logoColor=white) | React Hook Form |
| ![Zod](https://img.shields.io/static/v1?label=&message=Zod&color=3068b7&logo=zod&logoColor=white) | Zod |
| ![Framer Motion](https://img.shields.io/static/v1?label=&message=Framer%20Motion&color=00B3FF&logo=framer&logoColor=white) | Framer Motion |
| ![Tailwind CSS](https://img.shields.io/static/v1?label=&message=Tailwind%20CSS&color=06B6D4&logo=tailwind-css&logoColor=white) | Tailwind CSS |
| ![TanStack Query](https://img.shields.io/static/v1?label=&message=TanStack%20Query&color=FF4154&logo=react-query&logoColor=white) | TanStack Query |
| ![NextUI](https://img.shields.io/static/v1?label=&message=NextUI&color=000000&logo=nextui&logoColor=white) | NextUI |

s

## 💻 Running locally:

To run the this project locally, follow these steps:

### 1. Clone the repository from GitHub:

```sh
git clone https://github.com/noyonalways/tech-tips-hub-web.git
```

### 2. Navigate into the project directory:

```sh
cd tech-tips-hub-web
```

### 3. Install Dependencies (npm or yarn):

```sh
npm install
```

or

```sh
yarn
```

### 4. Set up environment variables:

- Create a `.env` file in the root directory.
- Define necessary environment variables such as database connection URL, PORT, etc. Refer to any provided `.env.example` file or documentation for required variables.

```sh
BASE_API=http://192.168.0.116:5000/api/v1
```

### 4. Run the Application:

```sh
npm run dev
```

or

```sh
yarn dev
```

Let me know if you need any further modifications!

[youtube-shield]: https://img.shields.io/badge/-Youtube-black.svg?style=round-square&logo=youtube&color=555&logoColor=white
[youtube-url]: https://youtube.com/@deskofnoyon
[facebook-shield]: https://img.shields.io/badge/-Facebook-black.svg?style=round-square&logo=facebook&color=555&logoColor=white
[facebook-url]: https://facebook.com/noyonalways
[facebook-group-url]: https://facebook.com/webbronoyon
[instagram-shield]: https://img.shields.io/badge/-Instagram-black.svg?style=round-square&logo=instagram&color=555&logoColor=white
[instagram-url]: https://instagram.com/noyonalways
[linkedin-shield]: https://img.shields.io/badge/-LinkedIn-black.svg?style=round-square&logo=linkedin&colorB=555
[linkedin-url]: https://linkedin.com/in/noyonalways
[vscode-shield]: https://img.shields.io/badge/-VS%20Code%20Theme-black.svg?style=round-square&logo=visualstudiocode&colorB=555
[vscode-theme-url]: https://marketplace.visualstudio.com/items?itemName=noyonalways.codevibe-themes

## Contact

- Email: [noyonrahman2003@gmail.com](mailto:noyonrahman2003@gmail.com)
- LinkedIn: [Noyon Rahman](https://linkedin.com/in/noyonalways)