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

https://github.com/huynhtruong01/news-it-dev

News IT helps everyone want to study, improve your knowleage about new technology, new programming languages, framework,...
https://github.com/huynhtruong01/news-it-dev

axios muiv5 mysql nodejs react react-quill socket-io typeorm typescript

Last synced: 3 months ago
JSON representation

News IT helps everyone want to study, improve your knowleage about new technology, new programming languages, framework,...

Awesome Lists containing this project

README

          

## OVERVIEW PROJECT

- **Name project**: Website News about **Information Technology**

- **Front-End**:
- ReactJS
- Redux Toolkit
- MUI
- ReactQuill
- Socket.IO
- **Tool**: ViteJS

- **Back-End**:
- NodeJS
- ExpressJS
- TypeORM
- Socket.IO

- **Database**: MySQL

---

### FRONT-END

1. **Code Structure**

```sh
src
|__components
|__common
|__index.tsx
|__features
|__News
|__pages
|__index.tsx
|__components
|__index.tsx
|__index.tsx
|__layouts
|__index.tsx
|__hooks
|__index.tsx
|__redux
|__index.tsx
|__utils
|__index.ts
|__App.tsx
|__main.tsx
```

---

### BACK-END

1. **Code Structure**

```sh
src
|__config
|__data.ts
|__index.ts
|__controllers
|__user.controller.ts
|__index.ts
|__entities
|__user.entity.ts
|__index.ts
|__services
|__user.service.ts
|__index.ts
|__middlewares
|__auth.middleware.ts
|__index.ts
|__models
|__user.model.ts
|__index.ts
|__enums
|__user.enums.ts
|__index.ts
|__routes
|__user.router.ts
|__index.ts
|__utils
|__index.ts
server.ts
```

2. **TODO**

- **Auth**:
- ✅ Signup
- ✅ Login
- ✅ Logout
- ✅ Refresh token when access token expires
- ❌ Send mail when sign up by email

- **Users**:
- ✅ CRUD User
- ✅ Follow/Unfollow User of User
- ✅ Get profile
- ✅ Reset password when forgot password
- ✅ Get profile
- ✅ Edit profile
- ❌ Change password when user want to
- ✅ Sort and Filter User

- **News**:
- ✅ CRUD News
- ✅ **Get** News by Public
- ✅ Count views
- ✅ Like/Dislike News
- ✅ Save/UnSave News of User
- ✅ Sort and filter News

- **Roles**:
- ✅ CRUD role
- ✅ Add Entity color

- **Hash tags**:
- ✅ CRUD hash tag
- ✅ Follow/Unfollow Hash tag by User
- ✅ Add Entity color, icon(img)

- **Comments**:
- ✅ CRUD comments
- ❌ Add comment
- ❌ Edit comment by self User
- ❌ Delete comment by self User
- ❌ Mention User when user Comment

- **Form**
- ✅ Form Image:
- ❌ Drag & Drag img from outside (ImageField)

- **Recommend System**: ❌

3. **FRONT-END TODO**

- **USER INTERFACE:**
- ✅ List News
- ✅ News Detail
- ✅ Login
- ✅ Sign up
- ✅ List Tags
- ✅ Tag Detail: Get all news by tagId

- ✅ Profile:
- ✅ Profile
- ✅ Setting
- ✅ Detail User

- ✅ Reading list (Save)

- ❌ Search page

- ❌ Create News

- ✅ Dashboard:
- ✅ News List
- ✅ Following List
- ✅ Followers List
- ✅ Tags List Follow

- **Features**:
- **Reading List Page**:
- ❌ **Archive & Unarchive** for news `saves` of this user.
- ❌ **Filter** news into user by `hash tag` and `search`.
- **Make profile for user**

- **Skeleton**:
- ❌ **News list**
- ❌ **News detail**
- ❌ **Hash tag list**
- ❌ **Hash tag detail**

### COMMENTS (TODO)

- **Create Comment**:

- **Delete Comment**:

- **Update Comment**:

- **Like Comment**:

### THE FOLLOW MAKE NOTIFY

- After user create new news, emit socket to create notify.
- Then, after create notify, it need to emit for client to add new notify to redux client.

> [https://www.youtube.com/watch?v=qikE08Zrnds&list=PLs4co9a6NhMyAfSnDg1MKGwLdLx0OA07d&index=33](https://www.youtube.com/watch?v=qikE08Zrnds&list=PLs4co9a6NhMyAfSnDg1MKGwLdLx0OA07d&index=33)

### MULTI LANGUAGES (i18next)

> [https://react.i18next.com/latest/using-with-hooks](https://react.i18next.com/latest/using-with-hooks)