Synthetic Biology Laboratory Information Management System (LIMS)

🎓 Final Project for Harvard's Web Programming with Python and Javascript CS50W hosted on eDX

💡Lessons Learned

• Gathering business requirements and scoping project feature development
• Prototyping Single Page Application User Interface in AdobeXD
• Creating new, meaningful SVG illustrations by combining and altering existing free SVG illustrations
• Architected SQL Database to Boyce-Codd Normal form in UML
• Using PostgreSQL with Django
• Implementing JSON Web Token authentication with Redis in Django
• Designing an API, especially in Django using django-rest-framework
• Implementing React Hooks
• Implementing complex state management in Redux
• Writing React and Redux in Typescript
• Integration testing React and Redux with Jest and react-testing-library
• End to end automation testing with Cypress
• Unit and Integration testing Django with pytest
• Behavioral Driven Testing: test the expected result, not the implementation details
• Implementing Test Driven Development: write tests as you go
• Implementing Domain Driven Development: start and finish features based on user stories
• Working with python virtual environment (virtualenv) for python dependency management
• Dockerizing the development environment for coordinating the following services: Django, PostgreSQL, Redis, and React
• Setting up linting with Prettier and Husky
• Setting up standardized commit messages with gitmoji
• Compressing files with Webpack and zipping files with brotli

🛠 Technologies

Protoyping	Graphic Design	Front-End	Back-End	Database	Deployment	Testing
Adobe XD	Adobe XD	React	Python3	PostgreSQL	Git	Jest
.	Freepik	Redux	Django	Redis	circleci	React Testing Library
.	.	Typescript	Django Rest Framework	.	Docker	Cypress
.	.	ES6	Celery	.	Kubernetes	PyTest
.	.	React Router	.	.	AWS Lambda	.
.	.	Formik	.	.	AWS Aurora	.
.	.	Styled Components	.	.	AWS API Gateway	.
.	.	Material UI	.	.	.	.

• note that italicized text indicates that the technology has not been applied yet

⚖️ Methodology

• Single Page Application for a better user experience.
• Separated front-end and back-end to avoid a monolithic architecture and to lay the foundation of a microservices architecture.
• Microservices architecture for decoupled business logic and more flexibility for adaptations in the future.
• React for front-end for the component-based approach to writing code, one-way data flow, and virtual document-object-model (DOM). Chose React over Angular and Vue since I have the most experience with React.
• Redux for managing state in React since this is a large application and managing React states would become unweidly in the long run.
• React and Redux both written in Typescript to leverage static typing for a more secure and well-tested application.
• Styled Components for styling for leveraging the power and benefits of CSS-in-JS.
• Django RESTful API for back-end. Django-rest-framework to simplify Create, Read, Update, and Delete routes. I've built a Django REST API without the help of a framework and there are no benefits to building routes at a lower level.
• Celery for asynchronous operations within Python since Django asynchronous support is still just for views (as of v3.1).
• SQL Database for leveraging the benefits of relational databases
• PostgreSQL as the Relational Database Management System (RDBMS) since it has more features integrations in Django
• Docker containerization of the application while in development mode because there are four different services and docker-compose provides automation for starting and ending the services.
• circleci for continuous integration and continuous delivery since I have the most experience with circleci. Considered using Jenkins, but my focus as a Web Developer is not DevOps.

⚙️ Features

• Manage user groups
• Manage chemical/biological inventory
• Manage protocols
• Manage projects (made up of protocols)
• Manage jobs (completing the protocol in a project)
• Manage products (output from a job)

📐 Tests

• Interactive code coverage diagram on codecov. The code coverage takes into account both the Django unit tests and the React unit/integration tests.
• Django unit and the React unit/integration junit.xml test reports and code coverage artifacts automatically uploaded to circleci.

🚀 Getting Started

System requirements:

• Make sure you have PostgreSQL installed and running on your computer. If you installed PostgreSQL with Homebrew, then you can start PostgreSQL with brew services start postgresql
• Make sure you have Redis installed and running on your computer. If you installed Redis with Homebrew, then you can start Redis with brew services start redis
• Create an .env file in the root directory with the following key: ENV_API_SERVER=http://127.0.0.1
• Create an .env file in the django-backend directory with the following keys:

  DJANGO_ENV=
  DEBUG=
  SECRET_KEY=
  DJANGO_ALLOWED_HOSTS=www.example.com localhost 127.0.0.1 [::1]
  
  DJANGO_ADMIN_USER=
  DJANGO_ADMIN_EMAIL=
  DJANGO_ADMIN_PASSWORD=
  
  DATABASE=postgres
  
  DB_DATABASE=db.postgresql
  DB_USER=postgres_user
  DB_PASSWORD=
  DB_HOST=
  DB_PORT=5432
  
  JWT=
  REDIS_URL=
  

• Create an .env file in the postgres directory with the following keys:

  POSTGRES_USER=
  POSTGRES_PASSWORD=
  

To run this project on your system with Docker:

1. Make sure you have Docker installed and running on your computer
2. In your terminal, navigate to the root of this repository and run docker-compose up (Docker will automatically run docker-compose up --build for the first setup phase)

⚠️ Important: if you are getting conflict errors, you should run docker stop <container name> that is already running in the background.
⚠️ Important: if you are getting other errors, you should run docker-compose down to bring everything down, and start over.

To run this project on your system manually (without Docker):

1. Ensure that python3, python3-pip, and python3-venv are installed on your system
2. (For first time running this application) run python3 -m venv venv to create the virtual environment. Navigate to the directory django-backend and run source venv/bin/activate to activate the virtual environment. (For first time running this application) Run pip install -r requirements.txt to install the django dependencies
3. (If you need to set up local database) Navigate to the directory django-backend and run python3 manage.py migrate and then python3 manage.py makemigrations
4. While still in the django-backend directory, run python3 manage.py runserver to start the server
5. (For first time running this application) Navigate to the directory react-frontend/frontend and run npm install to install the react dependencies
6. Open a new terminal tab or window, navigate to the directory react-frontend/frontend, and run npm start
7. To view the application in a web browser, visit http://localhost:3000

To contribute to this project on your system:

• Ensure that git lfs is installed on your system. Download the extension here git-lfs.github.com.
• To make git commits, navigate to the root directory, add files to git staging with git add <path/to/file>, and then run git commit to activate the Gitmoji interactive prompt in your terminal. Here's a preview of the interactive prompt. After completing the prompt, exit with :wq
• If making README.md updates, be sure to add [skip ci] to the git commit message in order to prevent running unneccessary tests in continuous integration and deployment.

🔒 License

Copyright Notice and Statement: currently not offering any license. Permission only to view and download. Refer to choose a license for more info.