FUSA
An open-source gender-neutral period-tracking app that leaves data management in it's totally to the end user.
โจ Inspiration
From Jessica Khoury's tweet https://twitter.com/jkbibliophile/status/1540345161955385345
Delete your period tracking apps today.
๐ Contents
- ๐ฐ Description
- ๐ Documentation
- ๐งฑ Tech Stack
- ๐ Architecture
- ๐ก Objectives and requirements
- ๐ฝ Product
- ๐ Deployment
- ๐น Usage
- โ๏ธ Legal notice
- ๐ง๐ฝโโ๏ธ Acknowledgements
๐ฐ Description
A period tracking app based on the premise that no server will store the data, not even temporarily (and this is an important and crucial part of the project's idea).
๐ Documentation
All the documentation is detailed at the /docs
folder which you can access from here or at the official link.
๐งฑ Tech Stack
- Vue3
- Frontend framework based on reactivity and progressiveness originally developed by Evan You.
- Typescript
- Improved version of JavaScript that implements TypeScript so that safer code is delivered.
- Vite
- Web bundler originally created for Vue's ecosystem.
- Tailwind
- CSS library that delivers a really small bundle to the client with only what you used.
- Vitest + Cypress
- Testing packages for unit, integration and e2e tests.
- Docker + Docker-Compose
- Virtualization technologies to deploy containers with the technologies you want.
๐ Architecture
It will attempt to be an hexagonal architecture so to say, since there will be no backend, elements have to be processed on the client, but that does not mean no structure should be followed.
I'm choosing the hexagonal architecture since entities will be the core part of the application. There will be connections (in both ways) to the IndexedDB, to the UI (React), to the store most likely (Redux). Having as much information and logic of each entity centralized will be helpful on the long run, and, from my current perspective, it will be scalable.
As for the decisions, they're based on my experience, both professional and personal experiences, mostly personal. But it is worth noting that this project will be complicating things for the sake of it, not necessarily reinventing the wheel, but it's not it's most optimized version. But I'll learn along the way, and will be prototyping until I get it right.
๐ก Objectives and requirements
For the up-to-date document defining the requirements and objectives, please, refer to the REQUIREMENTS.md document.
๐ฝ Product
๐ฅ Description
It's going to be a period tracking app based on the premise that the user will have total and full access and control to their data, and it will be gender-neutral and customizable to an extent (as much as I'm able to do and acknowledge).
๐ค Why?
The situation in USA at the moment of development is out of control, it has put, not only women, but any fertile, person with a uterus at high risk, so, currently, having a period tracking app may put you in danger since they may be selling your data (which, if not most, a lot of them are! More on that on the following article How period tracking apps and data privacy fit into a post-Roe v. Wade climate.
Periods are also something that as a cis male, I don't know that much about, but I'm ready to learn all that I can, and is also a strong point I'm looking forward
๐ Roadmap
It is specified, visible and up-to-date at the Github's Project.
๐ Deployment
It will be deployed on Github Pages for the moment being. I might end up using VercelJS in the future, but it's something I have not properly considered.
๐น Usage
It uses vue, with vite, since it uses vite, it already provides some utility commands.
๐ด๏ธ Pre-requisites
You'll need to have node.js install in your system to run the application locally. It could also be delivered on-premise (not the intended way though).
I'm currently using:
- node.js (v15.14.0)
- npm (8.11.0)
โ๏ธ How to start the app
Kind of simple, if you've met the requirements
npm run dev
So you can now head to:
https://localhost:3000
๐งโ๐ How to deploy the app
You can just execute the following command.
npm run build
And move the app/dist/
folder it genereted to the path you want to application in.
This process can be completely be automated.
๐งช How to test the app
The following command, using vitest, will be testing on watch mode, which means it won't exit, and as soon as you make a change, it will refresh the test you modified, a little more complex than that, but until that I kind of comprehend.
npm run test
If you want the coverage, and this one won't execute on watch mode, meaning, once finished, it will stop.
npm run coverage
โ๏ธ Legal notice
It attempts to be as crystal clear as possible, but no data is intended to be stored at any other device that your own. To be shared with no one but who you consent by directly sending your data with whatever security you mean necessary and required, at your own risk. Be safe out there!
๐ง๐ฝโโ๏ธ Acknowledgements
- To Jessica Khoury for her viral tweet putting to the light such a serious problem.
- To all the people with uterus in USA that at such level of risk because of old jerks.