Tip
This application is actively in development. While additional security measures have been added, Focusty is still not intended for handling sensitive data in production.
Focusty is a full-stack productivity app built with Vue, Vite, Python, and Django, integrating Pomodoro techniques, advanced task management, and insightful analytics for anyone aiming for peak productivity.
The app stands out by integrating multiple productivity features into one cohesive platform, offering a seamless experience tailored for focused time management. The application uses Django for the backend and Vue.js for the frontend, along with JWT authentication for security and user data management. Building Focusty involved complex state management, asynchronous task updates, and interactive, real-time UI elements that enhance usability, making it both distinctive and technically challenging.
- Pomodoro Timer: Boost your productivity with a fully customizable Pomodoro timer, meticulously engineered for focus and efficiency.
- Task Management: Effortlessly organize your tasks with intuitive drag-and-drop functionality, precise date and time pickers, and automatic sorting algorithms.
Recurring Tasks: Now supports repeating tasks with customizable intervals and easy management, ensuring you never miss a deadline.
- Calendar View: Visualize your schedule with a sleek weekly calendar view, empowering dynamic task creation and seamless manipulation.
- Task Color Customization: Personalize your tasks by changing colors!
- User Authentication: Securely authenticate and manage profiles with JWT and password hashing.
- Statistics and Analytics: Gain profound insights into your productivity journey with dynamic line charts, meticulously tracking task completion and Pomodoro focus time.
- Accessibility: Now optimized to be 100% accessible, ensuring an inclusive user experience.
link: https://trisdeveloper.github.io/focusty/
- Adding Tasks: Effortlessly add new tasks by clicking on the today tasks section and providing essential details such as title, description, date, and time.
- Editing Tasks: Seamlessly modify task details, mark tasks as completed, change colors or remove tasks directly from the calendar view.
- Recurring Tasks: Easily create and manage repeating tasks to keep your productivity on track.
- Drag-and-Drop: Streamline your workflow by effortlessly rearranging tasks through intuitive drag-and-drop gestures.
- Focus Sessions: Personalize your focus sessions with customizable focus and break durations, complemented by a sleek Pomodoro timer.
- Notifications: Stay on track with timely notifications and audible alerts at the end of each focus session.
- Journey Page: Visualize your productivity journey with sophisticated line charts, meticulously charting task completion and Pomodoro focus time over the past week.
The application is live and accessible at this link, ready for immediate use. If you'd like to run Focusty locally:
-
Clone the Repository: Use
git clone https://github.com/trisDeveloper/focusty
to get the project files. -
Run Backend:
cd focusty/backend/
- Set up a virtual environment
python3 -m venv venv && source venv/bin/activate
(optional but recommended) - Install dependencies
pip install -r requirements.txt
- Apply Django migrations
cd focusty/ && python manage.py makemigrations focusty_app && python manage.py migrate
- Run the Django development server
python manage.py runserver
The backend should now be accessible at
http://127.0.0.1:8000
. - Set up a virtual environment
-
Run Frontend:
cd focusty/frontend/
- Install dependencies
npm install
- Run the Vue development server
npm run dev
The frontend should now be accessible at the provided local server link, typically
http://localhost:5173/focusty#/
. - Install dependencies
- settings.py: Configuration settings for the Django project, including database setup and installed apps.
- urls.py: URL routing for the application, mapping URL patterns to views.
- views.py: Contains the logic for handling requests and returning responses for the API.
- models.py: Defines the data models for the application (e.g., User, Task).
- serializers.py: Serializers for converting complex data types, such as querysets, into JSON format.
- requirements.txt: Lists the Python packages required to run the backend.
- main.js: The entry point for the Vue.js application, setting up the Vue instance.
- App.vue: The root component of the application, containing the main layout and structure.
- components/: Directory containing reusable Vue components (e.g., TaskList, TaskCard, NavMenu).
- views/: Directory containing the different views for the application (e.g., HomeView, CalendarView, PomodoroView).
- router.js: Defines the routing for the Vue application, mapping URLs to components.
- store.js: Pinia store setup for state management across components.
- package.json: Contains metadata about the project and lists npm dependencies.
The journey of Focusty commenced on February 1st, 2024. Struggling to find an accessible time management app, I decided to develop my own. While it's currently in its early stages and may not match established platforms, it's a work in progress, continuously evolving based on user feedback and technological advancements. Passionate about empowering users to optimize productivity, I'm committed to its ongoing improvement.
Leveraging a comprehensive tech stack comprising Vue, Vite, Axios, Chart.js... for frontend and Python, Django, RestFramework... for backend and a myriad of other cutting-edge technologies, development commenced with meticulous attention to detail and relentless pursuit of perfection. From user authentication to task management and analytics, each feature was meticulously crafted to deliver a seamless user experience. Although the app is still in its early stages and may not yet meet industry standards, it's continuously evolving with a plethora of new features and improvements on the horizon.
Throughout the development process, feedback loops were integral to refining and enhancing Focusty's functionality and usability. Iterative improvements, bug fixes, and performance optimizations were rigorously implemented to ensure that Focusty exceeded user expectations.
- Enhanced Task Features: Implement sub tasks, and categories to elevate task management capabilities.
- Integration with External Tools: Seamlessly integrate with popular productivity tools such as Google Calendar and Trello to streamline workflows and maximize efficiency.
- Security Enhancements: Regular security audits and data encryption, OAuth Integration to simplify login while maintaining security.
Contributions are invaluable to the continued evolution of Focusty. Whether you have ideas for new features, enhancements, or bug fixes, we welcome your contributions with open arms. Please feel free to open an issue or submit a pull request to join us on this exciting journey of productivity innovation.
This project is licensed under the MIT License.