Giter Club home page Giter Club logo

tweet's Introduction

Tweet - a Twitter clone

semantic-release: angular

Technologies used

For this project we are going to use pnpm

To install it:

npm i -g pnpm

Install dependencies

pnpm i

Getting Started

First, run the development server:

pnpm dev

Open http://localhost:3000 with your browser to see the next.js page.

Open http://localhost:8090/_ with your browser to see the pocketbase admin UI.

You can start editing the page by modifying app/page.tsx. The page auto-updates as you edit the file.

API routes can be accessed on http://localhost:3000/api/hello. This endpoint can be edited in pages/api/hello.ts.

The pages/api directory is mapped to /api/*. Files in this directory are treated as API routes instead of React pages.

This project uses next/font to automatically optimize and load Inter, a custom Google Font.

Learn More

To learn more about Next.js, take a look at the following resources:

You can check out the Next.js GitHub repository - your feedback and contributions are welcome!

Deploy on Vercel

The easiest way to deploy your Next.js app is to use the Vercel Platform from the creators of Next.js.

Check out our Next.js deployment documentation for more details.

Playwright

Windows or Ubuntu

pnpm exec playwright install --with-deps

Docker

docker pull mcr.microsoft.com/playwright:latest

Arch Linux

To set up playwright on arch linux:

yay -S libffi7 enchant1.6 icu66 libwebp052
sudo ln -s /usr/lib/libpcre.so /usr/lib/libpcre.so.3

Contributing

Commit Message

To commit please follow the Conventional Commits rules

This will provide a prompt to help you write good commit messages for us to handle. This will automatically run the git commit command for staged files.

IMPORTANT: ALL MESSAGE SHOULD BE LOWERCASE

VSCode

If you want to commit in VSCode I highly recommend using this extension: Conventional Commits

You can access VSCode Conventional Commits in two ways:

  1. Command + Shift + P or Ctrl + Shift + P, enter Conventional Commits, and press Enter.
  2. Click the icon on the Source Control menu. See the image below.

Icon on the Source Control menu

tweet's People

Contributors

cuexter avatar semantic-release-bot avatar hamspncr avatar dependabot[bot] avatar fal0258 avatar sumwai0920 avatar

Stargazers

 avatar  avatar

Watchers

Kostas Georgiou avatar  avatar

Forkers

fal0258

tweet's Issues

feat(UI): Responsive Layout with headers, sidebar, and footer

This feature request aims to add a responsive layout with headers, sidebar, and footer in the twitter clone app.

UI

  • Implement a header component that includes the app logo, navigation links, and user information (if logged in)
  • Implement a sidebar component that includes a list of trending hashtags, a list of popular users to follow, and a search bar
  • Implement a footer component that includes copyright information, legal links, and social media links
  • Ensure the header, sidebar, and footer are displayed correctly on various screen sizes and devices, including desktops, tablets, and mobile phones

Note: The responsive layout should be easily customizable and should follow modern web design practices and accessibility standards.

feat(tweet): display tweet

This feature request aims to display tweets in the twitter clone app. The following functionalities need to be implemented:

UI

  • Display Tweet Information
  • Display Author
  • Show the number of likes, retweets, for the tweet
  • Display attachment

Server-side functionality:

  • Fetch tweets from the database

Note: The display of tweets should be paginated, and the number of tweets displayed per page should be customizable by the user.

feat: add recommendation system

This feature request aims to add a recommendation system to the twitter clone app. The following functionalities need to be implemented:

UI

  • Show a list of recommended tweets on the home page
  • Show a list of recommended users on the user profile page
  • Show a list of recommended hashtags on the hashtag page

Server-side functionality:

  • Implement an algorithm to recommend tweets based on a user's activity and interests
  • Implement an algorithm to recommend users based on a user's activity and interests
  • Implement an algorithm to recommend hashtags based on a user's activity and interests

Note:

The recommendation system should be updated in real-time based on a user's activity and preferences. The recommendation system should also take into account the popularity of tweets, users, and hashtags in order to provide relevant and accurate recommendations to users.

feat(chat): direct messages

This feature request aims to add support for direct messages in the twitter clone app. The following functionalities need to be implemented:

UI

  • Find a way to display a chat window on the side
  • Show all the direct messages between the current user and another user when viewing the direct messages for that user
  • Provide the ability for users to send direct messages to each other
  • Send video, image, voice messages

Server-side functionality:

  • Store direct messages in the database and associate them with the sender and recipient
  • Store video, image, voice messages
  • Fetch all direct messages between two users
  • Store and fetch metadata related to direct messages, such as the number of direct messages sent between two users

Note: The direct message feature should only be accessible to users who are logged in.

feat(admin): ban user

This feature request aims to implement the functionality for administrators to ban a user in the twitter clone app. The following functionalities need to be implemented:

UI

  • In the user management page, administrators should be able to see a list of users and their current status (active or banned)
  • Administrators should be able to ban or unban a user by clicking a button in the user management page

Server-side functionality:

  • Store the ban status of a user in the database
  • Check the ban status of a user before allowing them to post tweets or perform other actions
  • Store and retrieve the ban status of a user when displaying the user information

Remarks

  • Only administrators should be able to access the user management page and ban a user

feat: db seeding

Feature Request

providing basic database items to help with development

Description

Please describe the feature you are requesting.

Benefits

What benefits does this feature provide for the users or the business?

Requirements

What specific requirements does this feature need to meet?

Additional Information

Any additional information or context that would be helpful in understanding the feature request.

feat(chat): group chat

This feature request aims to add group chat support in the twitter clone app. The following functionalities need to be implemented:

UI

  • Add a group chat button in the chat page
  • Show all current group chats in a list view
  • Allow users to create new group chats and add members to the chat
  • Allow users to send messages and receive messages in a group chat

Server-side functionality:

  • Store group chat information in the database, such as chat name, members, and messages
  • Fetch all group chats for a user
  • Store and retrieve group chat messages

Note: Only authorized users should be able to access group chats and send messages in group chats.

feat: hashtag support

This feature request aims to add hashtag support in the twitter clone app. The following functionalities need to be implemented:

UI

  • Show a list of trending hashtags on the home page
  • Show a list of hashtags used in a tweet when viewing the tweet detail
  • When composing a tweet, users should be able to add hashtags to their tweet by typing '#'
  • Show all tweets that contain a specific hashtag when viewing the hashtag detail
  • Show the number of tweets that contain a specific hashtag

Server-side functionality:

  • Store hashtags in the database and associate them with a tweet
  • Fetch all tweets that contain a specific hashtag
  • Fetch a list of trending hashtags
  • Store and fetch hashtag metadata, such as the number of tweets that contain the hashtag

Database

see #9

Data fetching: Server-side

Data mutation: Client-side

Note: Hashtags should be case-insensitive, and hashtags that are similar but contain different capitalization should be treated as the same hashtag. For example, #Javascript and #javascript should be treated as the same hashtag.

feat(tweet): like/dislike tweet

This feature request aims to add the functionality of liking and disliking tweets in the twitter clone app. The following functionalities need to be implemented:

UI

  • Show a button next to each tweet that allows users to like or dislike the tweet
  • Show the number of likes and dislikes for each tweet
  • Indicate whether a user has already liked or disliked a tweet
  • When a user likes or dislikes a tweet, the number of likes and dislikes should be updated in real-time

Server-side functionality

  • Store information about likes and dislikes in the database
  • Fetch the number of likes and dislikes for each tweet
  • Fetch information about whether a user has already liked or disliked a tweet

Note: Users should be able to change their like or dislike on a tweet, meaning they can change their mind after initially liking or disliking a tweet. The number of likes and dislikes should be updated accordingly.

feat: user registeration

This feature request aims to add user registration functionality in the twitter clone app. The following functionalities need to be implemented:

UI

  • Add a "Sign up" page for user registration
  • Allow users to enter their username, password, email, display name and tag name when signing up
  • Show an error message if the entered username or email already exists in the database

Server-side functionality:

  • Store user information in the database, including username, password, email, display name, tag name, and a flag indicating whether the user is an admin or not
  • Check if the entered username or email already exists in the database and return an error message if either already exists

Remark:

  • Implemented after #13 is done

feat: user login

This feature request aims to add user login functionality to the twitter clone app. The following functionalities need to be implemented:

UI

  • Show a login form on the login page
  • Show an error message if the user provides an invalid username/password
  • Redirect the user to the home page if the login is successful
  • Show a logout button on the home page if the user is already logged in

Server-side functionality:

  • Authenticate the user using the username and password provided
  • Store the user's session information, such as the username, display name, and whether the user is an admin
  • Invalidate the user's session when the user logs out

Remark:

  • Login should be done on client-side, while authentication should be done on server-side

feat: add searching functionality

This feature request aims to add a search functionality in the twitter clone app. The following functionalities need to be implemented:

Allow searching for users, tweets, hashtag both separably or combined

UI

  • Add a search bar to the header of the app
  • Show a list of tweets that match the search query in a separate view
  • Show a list of users that match the search query in a separate view
  • Show a list of hashtags that match the search query in a separate view

Server-side functionality:

  • Store the tweets, users and hashtags in the database
  • Search the database for tweets, users, and hashtags that match the search query

Remark:

  • Only authorized users can perform search.
  • The search should be case-insensitive.

feat: user settings

This feature request aims to add user settings in the twitter clone app. The following functionalities need to be implemented:

UI

  • Show a settings page where the user can change their password, email, display name, and profile description
  • Validate the input for each field and display error messages if the input is invalid
  • Show a preview of the user's profile picture and allow the user to upload a new profile picture
  • Show a preview of the user's tag name and allow the user to change it

Server-side functionality:

  • Update the user's password, email, display name, profile description, and profile picture in the database when the user saves their changes
  • Fetch the user's settings data from the database to display on the settings page

Note: The user's tag name must be unique and cannot be changed to an existing tag name. The user's email must also be unique and cannot be changed to an existing email.

feat(tweet): edit tweet

This feature request aims to allow users to edit their tweets after they have been posted. The following functionalities need to be implemented:

UI

  • Reuse the form used for composing a tweet to allow users to edit their tweets
  • Show the edit history of a tweet, including the date and time of each edit and the user who made the edit

Server-side functionality:

  • Store the edit history of a tweet in the database

Note: Only the user who posted the tweet should be able to edit it.

feat: user card when hovering

Feature Request

A card that display user info, useful for hovering links of user tag

Description

Please describe the feature you are requesting.

Benefits

What benefits does this feature provide for the users or the business?

Requirements

What specific requirements does this feature need to meet?

Additional Information

Any additional information or context that would be helpful in understanding the feature request.

feat(auth): OAuth2 Authentication

This feature request aims to add OAuth2 Authentication support in the twitter clone app. The following functionalities need to be implemented:

UI

  • Implement the OAuth2 login flow on the client-side, allowing users to sign in using an OAuth2-compatible service, such as Google or Facebook.
  • Display a button for the user to initiate the OAuth2 login flow.
  • Once the user is logged in, display their profile information and the ability to log out.

Server-side functionality:

  • Handle the OAuth2 login flow by redirecting the user to the OAuth2 provider's website to grant permission to access their data.
  • Exchange the authorization code returned from the OAuth2 provider for an access token.
  • Use the access token to retrieve the user's profile information from the OAuth2 provider's API.
  • Store the access token and profile information in the database, and associate them with the user's account in the app.

Database operations:

  • Store the user's access token and profile information in the database, and associate them with the user's account in the app.

Note: The specific OAuth2 provider that is used should be configurable, as different providers have different APIs and requirements for accessing user data.

feat(UI): dark mode support

This feature request aims to add dark mode support in the twitter clone app. The following functionalities need to be implemented:

UI

  • Add a toggle button to switch between light and dark mode
  • Implement the dark mode theme and apply it to the entire app

Note: The dark mode theme should be user-friendly and easy to read, even in low-light environments.

feat(UI): :art: add pretty animations

This feature request aims to add pretty animations in the twitter clone app's user interface.

UI

  • Implement animations in various parts of the app such as navigation menus, loading indicators, button interactions, etc.
  • Animations should enhance the user experience and make the app more visually appealing.

feat: block user

This feature request aims to add the functionality to block users in the twitter clone app. The following functionalities need to be implemented:

UI

  • Show a list of blocked users in the user's settings page
  • Provide a way to unblock a user in the settings page
  • Show a message indicating that a user is blocked when attempting to view their profile
  • Show a message indicating that a user is blocked when attempting to view their tweets
  • Show a message indicating that a user cannot reply to a blocked user's tweets

Server-side functionality:

  • Store the blocked user relationship in the database
  • Fetch the list of blocked users for a given user
  • Check if a user is blocked when fetching a user's profile and tweets

Remark:

Maybe implement this after #32 searching user is done

Note: A user should not be able to block themselves or an admin user.

feat(admin): crud user

This feature request aims to add the ability for the admin to manage user information in the twitter clone app. The following functionalities need to be implemented:

UI

  • Admin should be able to create a new user
  • Admin should be able to update existing user information
  • Admin should be able to view user information
  • Admin should be able to delete a user

Server-side functionality:

  • Store user information in the database
  • Update existing user information in the database
  • Delete user information from the database
  • Fetch user information from the database

Note: Only authorized admin should be able to access these functionalities.

feat(stream): allow streaming video

This feature request aims to add video streaming functionality to the twitter clone app. The following functionalities need to be implemented:

UI

  • Show a video streaming component in the tweet composition page
  • Show video streaming component in the tweet detail page
  • Show all video streams that belong to a user in the user profile page

Server-side functionality

  • Store video streams in the database and associate them with a tweet or user
  • Fetch all video streams that belong to a user
  • Store video stream metadata such as number of views, likes, etc.
  • Fetch video stream metadata

Note

  • The video streaming component should be able to handle different video file formats
  • Users should be able to pause, play and control the volume of the video

feat: timeline view

This feature request aims to add a timeline view in the twitter clone app. The following functionalities need to be implemented:

UI:

  • Display a timeline of all tweets posted by users that the current user is following
  • Display the tweet text, username, timestamp, and any other relevant information for each tweet
  • Implement an infinite scrolling feature to allow the user to view older tweets as they scroll down the page

Server-side functionality:

  • Fetch the list of users that the current user is following
  • Fetch the tweets posted by those users
  • Return the fetched data to the UI in a format that can be easily displayed

Remark:

  • The timeline view should be the default view when the user logs in to the app.
  • The timeline should be updated in real-time to show new tweets as they are posted.

feat: authentication provider for client side

This feature request aims to add authentication provider support in the twitter clone app. The following functionalities need to be implemented:

  • Create a React component to be the Authentication store, make it a context provider to all the children component

feat(tweet): draft tweet

This feature request aims to add the functionality of draft tweets in the twitter clone app. The following functionalities need to be implemented:

UI

  • Show a list of draft tweets in the user's profile
  • Provide an option to compose a new draft tweet or edit an existing draft tweet
  • Show a notification when a draft tweet is saved

Server-side functionality:

  • Store draft tweets in the database and associate them with a user
  • Fetch the list of draft tweets for a user

Remark

  • Only users who created the draft should be able to access their draft tweets and create/edit them.

feat: display trending hashtag

This feature request aims to display trending hashtags in the twitter clone app. The following functionalities need to be implemented:

UI

  • Show a list of trending hashtags on the home page
  • Show the number of tweets that contain a specific hashtag

Server-side functionality:

  • Fetch a list of trending hashtags
  • Store and fetch hashtag metadata, such as the number of tweets that contain the hashtag

Note: The list of trending hashtags should be updated in real-time.

feat(tweet): retweet tweet

This feature request aims to add the functionality of retweeting tweets in the twitter clone app. The following functionalities need to be implemented:

UI

  • Show the retweet button on the tweet detail page
  • Show the number of retweets a tweet has received
  • Show a list of all retweets for a tweet
  • Show the original tweet and the user who retweeted it when viewing a retweet

Server-side functionality:

  • Store retweets in the database and associate them with a tweet and the user who retweeted it
  • Fetch a list of all retweets for a tweet
  • Fetch the original tweet and the user who retweeted it when viewing a retweet
  • Store and update the number of retweets a tweet has received

Remarks:

  • Only login users should be able to retweet tweets
  • When a user retweets a tweet, the retweet should be added to their timeline
  • The original tweet and the user who retweeted it should be linked, so that it is clear the retweet is not an original tweet, in the UI

feat: user profile

This feature request aims to add user profile functionality to the twitter clone app. The following functionalities need to be implemented:

UI

  • Show a user's profile information, such as their display name, tag name, profile picture, profile description, and number of tweets when viewing the user profile
  • Show a list of the user's tweets when viewing the user profile
  • Show the user's followers and following when viewing the user profile
  • Show a button to follow or unfollow a user when viewing the user profile
  • Show the user's profile picture, description, and display name on the home page, in the tweet detail, and in the user's tweets

Server-side functionality:

  • Store user profile information in the database, including display name, tag name, profile picture, profile description, and the number of tweets
  • Fetch a user's profile information when viewing the user profile
  • Fetch a list of the user's tweets when viewing the user profile
  • Store and retrieve the number of followers and following for a user
  • Store and retrieve the relationship between users, such as who is following whom

Remarks:

  • Only authorized users can edit their profile information.
  • The profile picture should be uploaded via Pocketbase file storage API and the URL should be stored in the database.

feat: following user

This feature request aims to add the ability for users to follow other users in the twitter clone app. The following functionalities need to be implemented:

UI

  • Show a list of users that the current user is following
  • Show a list of users that are following the current user
  • Show a button that allows the current user to follow/unfollow another user when viewing the other user's profile

Server-side functionality:

  • Store the relationships between users in the database (i.e. who is following whom)
  • Fetch a list of users that the current user is following
  • Fetch a list of users that are following the current user
  • Update the relationships in the database when a user follows/unfollows another user

feat(tweet): interactive poll tweets

This feature request aims to add support for interactive poll tweets in the twitter clone app. The following functionalities need to be implemented:

UI

  • Show a poll tweet in a visually appealing manner
  • Show the poll options and the percentage of votes for each option
  • Allow users to vote on a poll by clicking on one of the options
  • Show the result of the poll after it has ended

Server-side functionality:

  • Store poll tweets and poll options in the database
  • Store and retrieve poll results
  • End polls after a specified amount of time

Remarks:

  • Only logged-in users can vote on a poll tweet
  • Users should only be able to vote once per poll

feat(db): create collections

This feature request aims to create necessary collections in the database for the twitter clone app. The following functionalities need to be implemented:

  • A script to setup the schema and db
  • Setup pocketbase permission with Typescript

See #9

feat(ui): a new header

Feature Request

Description

Please describe the feature you are requesting.

Benefits

What benefits does this feature provide for the users or the business?

Requirements

What specific requirements does this feature need to meet?

Additional Information

Any additional information or context that would be helpful in understanding the feature request.

feat(tweet): post tweet

This feature request aims to add the functionality for users to post tweets in the twitter clone app. The following functionalities need to be implemented:

UI

  • Provide a form where users can enter the text of their tweet and post it
  • Show the newly posted tweet in the user's timeline immediately after it is posted

Server-side functionality:

  • Store the newly posted tweet in the database
  • Update the user's tweet count

Remark: Only logged-in users should be able to post tweets.

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.