This repository contains my full-stack side project, which is a social platform for people with chronic diseases.
Technologies used in this project:
The idea of this project, is to provide very simple and user friendly platform, where users can manage their chronic diseases, share their experiences with other people, find new friends and support each other.
Checkout the screenshots from the application with detailed explanations below for more details.
- Install the following dependencies:
- Ruby
3.2.0(I'm using chruby) - NodeJS
18.16.1(I recommend using nvm) - Yarn (
npm i --global yarn) - Docker (Ubuntu setup)
- Create
.envfile in the root directory and fill it with the necessary data. You can use.env.exampleas a template. To setup ActiveRecord encryption, you can use the following command:
bin/rails db:encryption:init- Setup docker containers for local development:
docker-compose up -d- Finally, execute the following commands:
# Install dependencies
bundle install
# Setup the Rails application:
./bin/setup
# Run the application:
./bin/dev- Sign in to the app:
Depending on the locale, the seed data will be different. For each locale (:en is default one), there is a predefined user with the following credentials (the Atopic Dematitis disease in the panel has some predefined data):
:en locale:
- Email:
john.doe@gmail.com - Password:
password
:pl locale:
- Email:
tomasz.nowak@gmail.com - Password:
password
I've came up with the design of this application by myself. I am not using any tools like Figma to create UI. I'm just creating the design on the fly. While working by myself, I really like this approach.
95% of SCSS code is also written by myself. I am not using any predefined templates, themes, blocks, utilities or component libraries, besides a few Stimulus Components or Quill Editor.
Maybe I'm weird, but I enjoy getting my hands dirty with CSS.
This application is my first take on Turbo (I've used Stimulus before, so it's not that big deal).
I haven't used the Turbo features in the whole project, but only in a few places, where the application required eager-loaded frames or some interactivity, like the comments section and reactions for disease statuses, friend requests, some of the forms and flash messages.
Right now, there are only model specs (406 examples, 0 failures), but I'm planning to add system specs in the future.
If the GitHub CI passes, it means that there all specs are passing and there are no Rubocop offenses in the codebase.
Note: The test database requires seeding. Also, if you are switching between locales, you need to seed the test database again:
RAILS_ENV=test bin/rails db:resetThis application is I18n-ready, offering full translation support for both Polish and English languages.
If you want to change the locale of the application, you can do it by changing the I18n.locale value in the config/initializers/locale.rb file.
# config/initializers/locale.rb
I18n.default_locale = :enRemember to reset and seed the database again after changing the locale, if you want to see the data in the new language.
Below is a list of features that I've already implemented or I'm planning to implement in the future.
- Users authentication using Devise
- Confirming account, resetting password
- Omniauth authentication with Google
- 2FA authentication
- Sing in using backup codes
- Showing feed from friends
- Showing common statistics
- Users can add disease from the list of predefined diseases
- Users have access to the disease panel, where they can manage their disease statuses, symptoms, risk factors, therapies and photos
- Users can share short updates about their disease and related well-being
- Friends and group members can comment and like disease statuses
- Comments and likes features are implemented using Hotwire
- Users can add disease symptoms with updates of their severity in time
- Users can add predefined symptoms
- Users can add their own symptoms
- Users can add disease risk factors, with the intensity of their influence on the disease
- Users can add disease treatments
- Multiple diseases can be assigned to the same treatment
- Users can post updates about the effectiveness of the treatment with simple statuses
- Users can add photos related to their diseases
- Users can only join groups related to their diseases
- When users join a group, they can see all of the disease statuses, symptoms, risk factors, therapies and photos from all of the users with the same disease. This way, users can compare their disease statuses, symptoms, therapies, etc. with other people.
- Users can share posts in groups about anything related to their disease
- All of the disease statuses from all of the users with the same disease are aggregated in one place
- All of the disease symptoms from all of the users with the same disease are aggregated in one place
- There are simple statistics about predefined symptoms assigned to the disease by all of the users
- All of the disease risk factors from all of the users with the same disease are aggregated in one place
- All of the disease treatments from all of the users with the same disease are aggregated in one place
- All of the disease photos from all of the users with the same disease are aggregated in one place
- Users can easily add common measurements like blood pressure, blood sugar, weight, etc.
- Users can track their measurements in time
- Users can easily view all health measurements from a specific day using the calendar view.
- Users can view their measurements in a chart
- Users can generate a PDF report with all of their measurements from a specific day
- Users can add simple notes
- Users can pin or unpin notes
- Users can add tags to notes
- Users can view their or others accounts
- Users can look for other users
- Users can search for other users
- Users can send friend requests to other users
- Users can submit a request for a specialist role, which will grant them a special status on the platform and enable them to write articles.
- Specialist requests are verified by the administrators, which can accept or reject the request.
- Specialists can write articles on the platform
- Articles can be filtered by tags
- Articles can be commented and liked by users
- Users can change their personal data
- Users can upload their avatar
- Users can enable two factor authentication
- Users can change their password when signed in
Below is the current ERD diagram of the application.
- Add models specs
- Fix all Rubocop errors
- Fix most of the queries performance issues (n+1, etc.)
- Complete the seeder
- Add authorization using Pundit policies
- Add background jobs
- Add system specs
- Add caching
- Add mailers
- Add notifications
- Add controller translations
- Add models translations
- Refactor controllers
- Add views translations
- Refactor routes
- Move from importmaps to
jsbundling-rails - Add RWD
Working on large side projects is incredibly time-consuming, and I didn't anticipate it to be to this extent. I'm pleased that I managed to complete the basic version of the project, as seen in the screenshots, in nearly 1.5 months. It's physically impossible to write such a substantial amount of code within a limited timeframe on my own.
One of the most time consuming parts of this project was the design and writing CSS. My goal was to create a simple and user friendly design from scratch without using any predefined templates, themes, blocks, utilities or component libraries.
Even though there are still a lot of things to do, I'm proud of what I've accomplished so far. I've learned a lot of new things, and I'm sure that I will learn even more while working on this project in the future.