Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/soniyaprasad77/twitterclient
Twitter frontend, powered by Next.js and React, offers a dynamic user experience with server-side rendering. GraphQL facilitates efficient data querying, while TailwindCSS ensures rapid styling and component reusability.
https://github.com/soniyaprasad77/twitterclient
graphql-client nextjs react-hooks ssr tailwindcss
Last synced: about 8 hours ago
JSON representation
Twitter frontend, powered by Next.js and React, offers a dynamic user experience with server-side rendering. GraphQL facilitates efficient data querying, while TailwindCSS ensures rapid styling and component reusability.
- Host: GitHub
- URL: https://github.com/soniyaprasad77/twitterclient
- Owner: soniyaprasad77
- Created: 2024-03-13T13:14:45.000Z (7 months ago)
- Default Branch: main
- Last Pushed: 2024-05-01T22:27:22.000Z (5 months ago)
- Last Synced: 2024-09-27T21:21:10.931Z (about 8 hours ago)
- Topics: graphql-client, nextjs, react-hooks, ssr, tailwindcss
- Language: TypeScript
- Homepage: https://twitter-client-beta.vercel.app
- Size: 2.37 MB
- Stars: 2
- Watchers: 1
- Forks: 1
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# Twitter Clone Frontend
This is a full-featured Twitter clone built with Next.js, Tailwind CSS, and GraphQL.
## Features
- **User Authentication:** Users can sign up, log in, and log out.
- **Tweeting:** Users can post tweets.
- **Follow/Unfollow:** Users can follow and unfollow other users.
- **Profile Viewing:** Users can view the profiles of other users.
- **Real-time Updates:** The application updates in real-time as users post tweets.
- **Redis Caching:** The application uses Redis for caching to improve performance.
- **Server-side Rendering:** The application uses Next.js for server-side rendering for improved performance and SEO.
## Tech Stacks Used
- Next.js, React, and GraphQL for building the application.
- Next.js enables server-side rendering for improved performance.
- React powers the dynamic user interface.
- GraphQL serves as the efficient API layer for querying backend data.
- TailwindCSS facilitates rapid styling and component reusability.
- User authentication is seamlessly managed with Google OAuth and JSON Web Tokens.
- React-Query optimizes client-side data caching for smooth user experiences.
- Codegen ensures type-safe GraphQL interactions.
- Amazon Web Services provides robust storage, deployment, and CDN services for scalability and reliability.
## Project Setup
To get the project up and running, follow these steps:
1. Clone the repository:
```bash
git clone https://github.com/soniyaprasad77/TwitterClient.git
```
2. Navigate into the project directory:
```bash
cd TwitterClient
```
3. Install the dependencies:
```bash
npm install or yarn add
```
4. Start the development server:
```bash
yarn dev
```
The application should now be running at
```
http://localhost:3000
```
Contributing
Contributions are welcome. Please open an issue or submit a pull request.