A twitter clone made using the awesome t3 stack!
- Description
- Screenshot
- Installation
- Usage
- Technology
- Features
- Credits
- License
- Contribution Guidelines
- Feedback
- Socials
This app was made as I wanted to explore making apps using the T3 stack. It's a CLI app builder that sets up the skeleton of a fully typesafe next js application. I also wanted to play around with using some other integrations like upstash for all the redis stuff like rate limiting, clerk for managing auth and much more!
You can tweet and view your profile and tweets. Will implement likes and comments when I get the time.
Main takeaways were learning to use the prisma ORM, tRPC to create typesafe APIs, Clerk for user auth and more!
I also learned how to use:
- Learned more about using NextJS
- slugs for variable routes for tweets and user profiles
- How to make a 404 page
- Using getStaticProps and generateStaticPaths to generate a static page
- Using upstash to implement a redis database for rate limiting
- How to use Planetscale to create and manage a deployed database
- Using create T3 app to scaffold an application
- React Hook Form
In order to run my site locally then please follow these steps:
-
Ensure that you have node and npm installed
-
For detailed instructions on installing node please follow this link for instructions
-
Ensure that you know the basics of the nextjs page router
- Otherwise please follow this link and follow the docs for editing any of the pages.
-
Clone this repository into your local repository.
git clone git@github.com:TheInfamousGrim/nextjs-personal-site.git.
-
Install the dependencies
npm install
If you've followed these steps correctly then the application should be good to go 😁
Link to live application: Click here
Please follow these steps to use the application locally
-
Spin up a developer server using webpack.
-
npm run dev -
this will spin up a server and allow you to hot replace anything if you want to develop on my site further.
-
-
open a new tab in your browser using the following URL or the one supplied in the terminal
http://localhost:3000/
The technologies used for the development of this app were:
- SSR & SSG.
- Built using nextjs.
- Tailwind classes so there's no conflicting css.
- Rate limiting thanks to Upstash
- Auth thanks to Clerk
- React Hook Forms to create easy validation and state management.
- Fully animated with the help of Framer Motion.
- Deployed using Vercel.
🙏 Made with the help of:
I'm open to have anyone jump in and contribute just message me on twitter
Please follow the contribution guidelines! Guidelines for contributing
Any feedback please email George Fincher
To learn more about the T3 Stack, take a look at the following resources:
- Documentation
- Learn the T3 Stack — Check out these awesome tutorials
You can check out the create-t3-app GitHub repository — your feedback and contributions are welcome!
Follow our deployment guides for Vercel, Netlify and Docker for more information.