✍️ Inkwell - Your Modern Storytelling Platform 🚀

Inkwell is a dynamic and engaging React-based platform designed for sharing stories, ideas, and experiences. Built with a modern tech stack, it provides a seamless and interactive user experience.

✨ Features

• 🖋️ Create and Share: Easily compose and publish your stories.
• 🔖 Bookmarks: Save your favorite posts for later reading.
• ❤️ Likes: Show appreciation for content you enjoy.
• 🌓 Dark Mode: Enjoy a comfortable reading experience day or night.
• 📱 Responsive Design: Seamless experience across desktop and mobile devices.
• 💬 Comments: Engage in conversations and share your thoughts with other users.
• 💾 Drafts: Save your work in progress and publish it later.
• 🔔 Notifications: Stay updated with likes, comments, and other activities.
• 👤 Profiles: Express yourself and customize your profile.
• 🔎 Search: Find content easily.

🛠️ Technologies Used

Technology	Purpose	Link
React	Building the user interface	https://react.dev/
React Router DOM	Handling navigation	https://reactrouter.com/
Vite	Fast build tool and development server	https://vitejs.dev/
TypeScript	Ensuring type safety and code quality	https://www.typescriptlang.org/
Tailwind CSS	Styling the application	https://tailwindcss.com/
React Hook Form	Form management	https://react-hook-form.com/
React Query	Data fetching and caching	https://tanstack.com/query/latest
Axios	Making HTTP requests	https://axios-http.com/
Date-fns	Date formatting	https://date-fns.org/
Headless UI	Unstyled, fully accessible UI components	https://headlessui.com/
Floating UI React	Toolkit to create floating UI elements	https://floating-ui.com/
React Icons	Incorporate popular icons in your React projects	https://react-icons.github.io/react-icons/
React Hot Toast	Display succinct notification toasts in React	https://react-hot-toast.com/

🚀 Getting Started

Follow these steps to set up Inkwell on your local machine:

⬇️ Installation

1. Clone the Repository:

   git clone https://github.com/Maxzi3/inkwell.git
   cd inkwell-frontend

2. Install Dependencies:

   npm install

3. Start the Development Server:

   npm run dev

💻 Usage

Running the application

1. Ensure all dependencies are installed.
2. Run the development server using npm run dev.
3. Open your browser and navigate to http://localhost:5173 (or the port provided by Vite).

Detailed Usage Instructions

Setting up environment variables

Before running the application, make sure to configure the environment variables. Copy the .env.example file to .env and fill in the required values.

Creating a new post

1. Navigate to the create post page.
2. Fill in the title, category, and content.
3. Upload an image (optional).
4. Click the "Post" button to publish your story.

Exploring the Dark Mode

Toggle the dark mode switch in the header to switch between light and dark themes.

Interacting with posts

• Like posts by clicking the heart icon ❤️.
• Save posts to your bookmarks by clicking the bookmark icon 🔖.
• Leave comments and engage in discussions 💬.

🤝 Contributing

We welcome contributions to Inkwell! Please follow these guidelines:

• Check the existing issues or create a new issue to discuss your proposed changes.
• Follow the established coding conventions.
• Submit a pull request with a clear description of your changes.

📜 License

This project is licensed under the MIT License.

🧑‍💻 Author Info

• Maxzi
  • GitHub: https://github.com/Maxzi3
  • Twitter: https://x.com/dev_maxzi
  • Website: https://dev-maxzi.vercel.app/