ibobko / historychart

History Chart

Project Name

Describe your project here. Provide an overview of what the project does and its purpose.

Getting Started

These instructions will get you a copy of the project up and running on your local machine for development and testing purposes.

Prerequisites

What things you need to install the software and how to install them

Python 3.x pip

Installing

A step by step series of examples that tell you how to get a development environment running

First, clone the repository:

git clone https://github.com/IBobko/historyChart.git
cd historyChart
python -m venv venv        # Creates virtual environment
source venv/bin/activate   # Activates the virtual environment on Unix/Linux/MacOS

pip install -r requirements.txt

Running the Application

export FLASK_APP=run.py      # Unix/Linux/MacOS
flask run

Running the tests

pytеst

npm init -y
npm install tailwindcss postcss autoprefixer postcss-cli
npx tailwindcss init

npx tailwindcss -i ./app/static/css/src/styles.css -o ./app/static/css/dist/styles.css --watch

MongoDB

docker run --name mongodb -d -p 27017:27017 mongo:latest

historychart's Issues

Set Up a Basic Backend for Data Reception and Storage

Objective: Develop a backend system capable of receiving data submissions from the frontend and storing them appropriately.

Details:

• Data Reception:

  • Implement API endpoints to receive data submissions from the frontend.
  • Ensure the API can parse and validate incoming data against expected formats and constraints.

• Data Storage:

  • Design a database schema that efficiently organizes the submitted data, considering future queries and data retrieval needs.
  • Implement functionality to save submitted data into the database, handling any potential errors to ensure data integrity.

• Testing:

  • Write unit and integration tests for the API endpoints and database interactions to ensure reliability and functionality.

• Documentation:

  • Document the API endpoints, including expected request formats and potential responses.
  • Provide setup instructions for the backend environment, including any necessary configuration steps and dependencies.

Expected Outcomes:

• A fully functional backend system that can receive, validate, and store data from the frontend.
• Clear and concise documentation that enables easy setup and usage of the backend system.

Completion Criteria:

• The task is considered complete when the backend system is capable of receiving data from the frontend, validating this data, and storing it in the database without errors. The backend must also be well-documented and tested for reliability.

Create a Prototype Page for Data Entry and Display

Objective: Develop a prototype web page that allows users to input data, save it, and view a list of previously entered data after the page refreshes.

Requirements:

1. User Interface Design:

   • Create a simple and intuitive user interface for data entry.
   • Include an input form with necessary fields (e.g., event name, date).
   • Provide a "Save" button to submit the form data.

2. Frontend Development:

   • Implement the frontend using HTML, CSS, and JavaScript.
   • Use JavaScript to handle form submission and data validation.

3. Backend Development:

   • Set up a basic backend to receive and store data from the frontend.
   • Use a simple server-side language/framework (e.g., Node.js with Express, Python with Flask).

4. Data Storage:

   • Store the submitted data in a temporary storage solution (e.g., in-memory storage, local file, database).
   • Ensure data persistence across page refreshes.

5. Data Display:

   • After submission, display the list of all previously entered data below the input form.
   • Implement functionality to refresh the list after each new submission without needing to manually reload the page.

6. Testing:

   • Perform basic testing to ensure form submission and data display functionality work as expected.

7. Documentation:

   • Document the setup process and instructions for running the prototype.
   • Include a brief description of the technology stack used and the reasoning behind your choices.

Completion Criteria: The task is considered complete when the prototype page allows for data entry, saving, and displays a list of entered data upon submission. The prototype should maintain data after a page refresh and be well-documented.

Setup Project Infrastructure and Visualize Data on Timeline

Objective: Establish the project infrastructure for development and to visualize historical data on a timeline using Python, MongoDB, and a selected data visualization library.

Expected Outcomes:

1. Environment Setup:

   • Install Python and set up a virtual environment.
   • Install and configure MongoDB for local development.
   • Initialize a Git repository and set up .gitignore.

2. Database Schema Development:

   • Define a MongoDB document schema, including fields for event name, date, and category.

3. Database Access Implementation:

   • Create a module for interacting with MongoDB, implementing CRUD operations.

4. API Development for Data Access:

   • Develop a simple RESTful API for retrieving event data from the database.

5. Data Visualization:

   • Select a Python library for data visualization (e.g., Matplotlib, Plotly).
   • Implement a function or script to convert database records into a format suitable for plotting on a timeline.
   • Generate a graph that visually represents events along a timeline based on data fetched via the API.

6. Testing:

   • Write unit tests for the database access layer and API endpoints.
   • Ensure the visualization accurately represents the fetched data.

7. Documentation:

   • Document the setup process, how to run the application, and how to use the API.
   • Provide examples of the visualization output.

Completion Criteria: The task is considered complete when the application can successfully fetch events from the MongoDB database, and these events are accurately visualized on a timeline. The project must be fully documented and tested.