Here is a working live demo: https://adam-gordon.info/posts
DevToday is a content creation platform for developers. It offers a feed of dev news, podcasts, and events, keeping you up-to-date with the latest tech. It has interactive features like podcast audio playback, meetup maps, and more. You can think of it as the go-to developer community hub.
- Motivation: To test my skills and put together a user friendly, developer focused social media site.
- Why I Built This Project: Alot of "Developer" social media is scattered, I wanted to centralize it.
- Problem Solved: Developers can arrange to meetup, record podcasts/audio to share informaation across multiple modes of communication, or just post.
- What I Learned: Using both browser API's and NextJS packages,
If your project has a lot of features, list them here.
- Content Creation Platform β DevToday provides users with tools and resources to create and share content easily, allowing knowledge sharing and expression within the community.
- Content Interaction Features β The app encourages engagement through likes, follows, and even communicating with other like-minded people through the contentβs comment section.
- Community Building β DevToday allows users to create groups of like-minded individuals, professionals, and enthusiasts in the tech space.
- Authentication with Clerk (or Next Auth)
- Onboarding
- Sort & Filters
- Collection & Pagination
- Global Command Search
- Image Uploads
- Profile Management
- Follows, Views, Likes
- Interactive map
- Audio Player
- Notification
- Social media share (Metatags)
- Top & popular lists
- Content preview
- Content Management CRUD (3 post types)
- Group Management (CRUD)
- Comment Thread
- Light & Dark mode
- Language - Typescript
- Framework - Next.js
- Libraries:
- Authentication - Clerk or Next Auth
- Styling - Tailwindcss with Shadcn or your favorite UX library
- Media Management - Uploadthing or Next Cloudinary
- Rich text editor - WYSIWYG editor - TinyMCE
- Rich text parser - html-react-parser
- Date picker - react-datepicker
- Database - Mongodb + Mongoose or Postgres + Prisma
- Validation - zod
- Interactive map - @vis.gl/react-google-maps or other libraries you wish to use
To get this project up and running in your development environment, follow these step-by-step instructions.
We need to install or make sure that these tools are pre-installed on your machine:
- NodeJS: It is a JavaScript runtime build.
- Git: It is an open source version control system.
- NPM: It is a package manager for JavaScript.
- ...
-
Clone the Repository
git clone https://github.com/username/repository.git
-
Navigate into the project directory
cd repository
-
Install dependencies
npm install
-
Set up environment variables (if necessary)
- Create a .env file in the root directory.
- Add environment-specific variables as needed.
-
Start the application
npm start
-
Open your web browser and navigate to http://localhost:3000 to see the project running.
-
Test the application
Run the test suite to ensure everything is working as expected.
npm test
DATABASE_URL=
DIRECT_URL=
UPLOADTHING_SECRET=
UPLOADTHING_APP_ID=
NEXT_PUBLIC_CLERK_SIGN_IN_URL=
NEXT_PUBLIC_CLERK_SIGN_UP_URL=
NEXT_PUBLIC_CLERK_AFTER_SIGN_IN_URL=
NEXT_PUBLIC_CLERK_AFTER_SIGN_UP_URL=
NEXT_PUBLIC_CLERK_PUBLISHABLE_KEY=
CLERK_SECRET_KEY=
NEXT_CLERK_WEBHOOK_SECRET=
NEXT_PUBLIC_GMAPS_KEY=
Want to contribute? Great!
To fix a bug or enhance an existing module, follow these steps:
- Fork the repo
- Create a new branch (
git checkout -b improve-feature
) - Make the appropriate changes in the files
- Add changes to reflect the changes made
- Commit your changes (
git commit -am 'Improve feature'
) - Push to the branch (
git push origin improve-feature
) - Create a Pull Request
If you find a bug (the website couldn't handle the query and / or gave undesired results), kindly open an issue here by including your search query and the expected result.
If you'd like to request a new function, feel free to do so by opening an issue here. Please include sample queries and their corresponding results.
- Enable Admins/Users to remove a user or assign a user the admin role in the Member's Tab.
- Delete Functionality cleanup
- Sweep for bugs.
- A proper Case Study.
List your collaborators, if any, with links to their GitHub profiles.
I'd like to acknowledge my collaborators, who contributed to the success of this project. Below are links to their GitHub profiles.
Furthermore, I utilized certain third-party assets that require attribution. Find the creators' links in this section.
If I followed tutorials during development, I'd include the links to those as well.
π© Darshin Von Parijs
Github: @DDVVPP
Adam Gordon
Email : [email protected]
Github : @AdamGordonNY