migrated tailwind from npm dependancy

ojadeyemi · Jun 2, 2024 · 6e97836 · 6e97836
1 parent 4bbdbcb
commit 6e97836
Show file tree

Hide file tree

Showing 12 changed files with 72 additions and 1,361 deletions.
diff --git a/.gitignore b/.gitignore
@@ -16,7 +16,7 @@ build
 *.egg-info
 
 #tailwind and prettier stuff
-node_modules
+tailwindcss
 *prettier*
 
 #vscode stuff

diff --git a/CONTRIBUTING.md b/CONTRIBUTING.md
@@ -1,21 +1,23 @@
 
 # How to Contribute
 
-To contribute to the USPORTS BASKETBALL WEB APP, follow these steps:
+ > NOTE: USPORTS has changed the structure of their website therefore  [usports-basketball](https://github.com/ojadeyemi/usports-basketball "Python package for current usports basketball stats") package will not be able to webscape data. Hopefully I find out how to update it. 
 
-1. Fork the repository to your GitHub account.
+### To contribute to the USPORTS BASKETBALL WEB APP, follow these steps:
 
-2. Clone the forked repository to your local machine:
+### 1. Fork the repository to your GitHub account.
+
+### 2. Clone the forked repository to your local machine:
 
 ```bash
 git clone https://github.com/ojadeyemi/USPORTS-BBALL-WEBAPP.git
 
 git checkout -b new-feature-or-fix #create new branch to add feature
 ```
 ## Prerequisites
-- MYSQL instance
-- Python (version 3)
-- Nodejs
+- MYSQL instance (SQLITE for development)
+- Python (version 3.10 or greater)
+- TailwindCSS executable file (Standalone CLI)
 
 
 ### Create a virtual environment in the terminal
@@ -36,30 +38,49 @@ Make sure that you have both [Node.js](https://nodejs.org/en) and [Python](https
 
 Double check that your python Interpreter path is in your virtual environment directory and node_modules is in the static/ directory.
 
-
-Install flask and all other dependacies from the [requirements.txt](requirements.txt) file with pip:
+---
+### Install flask and all other dependacies from the [requirements.txt](requirements.txt) file with pip:
 
 ```bash
  pip install -r requirements.txt
 ```
-
-Navigate to the static/ directory and install tailwindcss package with NPM:
+---
+### Install Tailwind CSS standalone CLI
+To install the Tailwind CSS standalone CLI, follow these steps::
 ```bash
-cd usport_flask_app/static/
- npm install -D tailwindcss
+# Download the executable for your platform from the latest release on GitHub
+# Example for macOS arm64
+curl -sLO https://github.com/tailwindlabs/tailwindcss/releases/latest/download/tailwindcss-macos-arm64
+
+# Give executable permissions to the downloaded file
+chmod +x tailwindcss-macos-arm64
+
+# Rename the executable to `tailwindcss`
+mv tailwindcss-macos-arm64 tailwindcss
 ```
+Now, you can use the standalone Tailwind CSS CLI just like the npm-distributed CLI tool:
+```bash
+# Create a tailwind.config.js file
+./tailwindcss init
 
+# Start a watcher
+./tailwindcss -i ./usport_flask_app/static/css/input.css -o ./usport_flask_app/static/css/output.css --watch
+
+# Compile and minify your CSS for production
+./tailwindcss -i ./usport_flask_app/static/css/input.css -o ./usport_flask_app/static/css/output.css --minify
+```
+---
 
-3. Make your changes and improvements to the codebase.
+### 3. Make your changes and improvements to the codebase.
 
-4. Test your changes locally to ensure they work as expected.
+### 4. Test your changes locally to ensure they work as expected.
 
 ```bash
  python app.py #run app on local server to see changes
  flask run --debug #or run with flask command
 ```
 
-5. Commit your changes with a descriptive commit message:
+### 5.  Commit your changes with a descriptive commit message:
 
 
 ```bash

diff --git a/README.md b/README.md
@@ -1,4 +1,4 @@
-# U SPORTS BASKETBALL WEB APP (IN PROGRESS) 🏀
+# U SPORTS BASKETBALL WEB APP (TO BE DEPLOYED) 🏀
 
 This website is a platform for sharing analytics and insights into the Canadian university basketball league, or U Sports. I am passionate about basketball and data analysis, and this project allows me to combine the two.
 
@@ -15,6 +15,8 @@ The U SPORTS BASKETBALL WEB APP project is organized into two main folders:
 
     > Note: [usports-basketball](https://github.com/ojadeyemi/usports-basketball "Python package for current usports basketball stats") has been integrated as a dependency in web application development. This allows for independent script maintenance and updates while ensuring seamless integration with the application's data processing pipelines. 
 
+    > NOTE: USPORTS has changed the structure of their website therefore  [usports-basketball](https://github.com/ojadeyemi/usports-basketball "Python package for current usports basketball stats") package will not be able to webscape data. Hopefully I find out how to update it. 
+
 2. **usport_flask_app**: This folder contains the Flask application code. It includes the routes, models, and other web application files.
 
 ---

diff --git a/app.py b/app.py
@@ -1,6 +1,6 @@
 """main app.py"""
 from dotenv import load_dotenv
-from config import DevelopmentConfig
+from config import DevelopmentConfig, ProductionConfig
 from usport_flask_app import create_app
 from usport_flask_app.models import db
 from data_pipeline import update_db

diff --git a/config.py b/config.py
@@ -9,6 +9,10 @@
 password = os.getenv("USPORT_BBALL_PASSWORD")
 
 mysqldatabase = f"mysql+pymysql://usportsballwebapp:{password}.@localhost/usports_bball"
+
+# SQLite database URL for development
+sqlite_database = "sqlite:///usports_bball_dev.db"
+
 class Config:
     """Default Configuration"""
     DEBUG = False
@@ -17,7 +21,7 @@ class Config:
 class DevelopmentConfig(Config):
     """Development Configuration"""
     DEBUG = True
-    SQLALCHEMY_DATABASE_URI = mysqldatabase
+    SQLALCHEMY_DATABASE_URI = sqlite_database
 
 class ProductionConfig(Config):
     """Production Configuration"""

diff --git a/data_pipeline/__init__.py b/data_pipeline/__init__.py
@@ -1,13 +1,19 @@
 import os
-from .database_update import update_usports_bball_db
+from dotenv import load_dotenv
+from data_pipeline.database_update import update_usports_bball_db
+from config import DevelopmentConfig, ProductionConfig
 
 # Load environment variables from .env file
-from dotenv import load_dotenv
 load_dotenv()
 
-# Retrieve the environment variable
-password = os.getenv("USPORT_BBALL_PASSWORD")
+# Determine the environment and select the appropriate database URL
+environment = os.getenv("FLASK_ENV", "development")
+
+if environment == "production":
+    database_url = ProductionConfig.SQLALCHEMY_DATABASE_URI
+else:
+    database_url = DevelopmentConfig.SQLALCHEMY_DATABASE_URI
 
 def update_db():
-    """ Update Database"""
-    update_usports_bball_db(password)
+    """ Update Database """
+    update_usports_bball_db(database_url)
diff --git a/data_pipeline/database_update.py b/data_pipeline/database_update.py
@@ -25,7 +25,7 @@
 from usports_basketball import usports_team_stats, usports_player_stats
 
 
-def update_usports_bball_db(mysql_password: str):
+def update_usports_bball_db(datbase_url: str):
     """
     Updates the usports_bball database with team and player statistics.
     """
@@ -36,11 +36,9 @@ def update_usports_bball_db(mysql_password: str):
     player_dtypes={'lastname_initials':types.NVARCHAR(length=5), 'first_name':types.NVARCHAR(length=255),
                     'school':types.NVARCHAR(length=50)}
 
-    mysqldatabase = f"mysql+pymysql://root:{mysql_password}@localhost/usports_bball"
-
     try:
         # Create a SQLAlchemy engine
-        engine = create_engine(mysqldatabase)
+        engine = create_engine(datbase_url)
         with engine.begin() as conn:
             logging.info("Connection successful!")
 

diff --git a/requirements.txt b/requirements.txt
@@ -1,6 +1,6 @@
 beautifulsoup4==4.12.3
 blinker==1.8.2
-certifi==2024.2.2
+certifi==2024.6.2
 cffi==1.16.0
 charset-normalizer==3.3.2
 click==8.1.7
@@ -18,15 +18,15 @@ mysql-connector-python==8.4.0
 numpy==1.26.4
 pandas==2.2.2
 pycparser==2.22
-PyMySQL==1.1.0
+PyMySQL==1.1.1
 python-dateutil==2.9.0.post0
 python-dotenv==1.0.1
 pytz==2024.1
-requests==2.31.0
+requests==2.32.3
 six==1.16.0
 soupsieve==2.5
 SQLAlchemy==2.0.30
-typing_extensions==4.11.0
+typing_extensions==4.12.1
 tzdata==2024.1
 urllib3==2.2.1
 usports-basketball==1.0.1

diff --git a/usport_flask_app/static/tailwind.config.js → tailwind.config.js b/usport_flask_app/static/tailwind.config.js → tailwind.config.js
@@ -1,8 +1,9 @@
 /** @type {import('tailwindcss').Config} */
 module.exports = {
-  content: ["../templates/**/*.html"],
+  content: ["./usport_flask_app/templates/**/*.html"],
   theme: {
     extend: {},
   },
   plugins: [],
-};
+}
+
diff --git a/usport_flask_app/static/css/output.css b/usport_flask_app/static/css/output.css
@@ -784,10 +784,6 @@ video {
   bottom: 0px;
 }
 
-.col-auto {
-  grid-column: auto;
-}
-
 .m-1 {
   margin: 0.25rem;
 }
@@ -818,11 +814,6 @@ video {
   margin-right: 1rem;
 }
 
-.mx-6 {
-  margin-left: 1.5rem;
-  margin-right: 1.5rem;
-}
-
 .mx-auto {
   margin-left: auto;
   margin-right: auto;
@@ -991,10 +982,6 @@ video {
   height: 100vh;
 }
 
-.max-h-10 {
-  max-height: 2.5rem;
-}
-
 .min-h-screen {
   min-height: 100vh;
 }
@@ -1031,10 +1018,6 @@ video {
   width: 100%;
 }
 
-.max-w-10 {
-  max-width: 2.5rem;
-}
-
 .max-w-5 {
   max-width: 1.25rem;
 }
@@ -1161,12 +1144,6 @@ video {
   margin-bottom: calc(1.25rem * var(--tw-space-y-reverse));
 }
 
-.space-x-7 > :not([hidden]) ~ :not([hidden]) {
-  --tw-space-x-reverse: 0;
-  margin-right: calc(1.75rem * var(--tw-space-x-reverse));
-  margin-left: calc(1.75rem * calc(1 - var(--tw-space-x-reverse)));
-}
-
 .divide-y > :not([hidden]) ~ :not([hidden]) {
   --tw-divide-y-reverse: 0;
   border-top-width: calc(1px * calc(1 - var(--tw-divide-y-reverse)));
@@ -1383,11 +1360,6 @@ video {
   padding: 2rem;
 }
 
-.px-1 {
-  padding-left: 0.25rem;
-  padding-right: 0.25rem;
-}
-
 .px-16 {
   padding-left: 4rem;
   padding-right: 4rem;
@@ -1762,6 +1734,11 @@ video {
   background-color: rgb(55 65 81 / var(--tw-bg-opacity));
 }
 
+.hover\:bg-green-900:hover {
+  --tw-bg-opacity: 1;
+  background-color: rgb(20 83 45 / var(--tw-bg-opacity));
+}
+
 .hover\:bg-neutral-500:hover {
   --tw-bg-opacity: 1;
   background-color: rgb(115 115 115 / var(--tw-bg-opacity));
@@ -1886,10 +1863,6 @@ video {
     display: inline;
   }
 
-  .md\:flex {
-    display: flex;
-  }
-
   .md\:table-cell {
     display: table-cell;
   }
@@ -1906,10 +1879,6 @@ video {
     height: 3rem;
   }
 
-  .md\:max-h-10 {
-    max-height: 2.5rem;
-  }
-
   .md\:w-11\/12 {
     width: 91.666667%;
   }
@@ -1922,18 +1891,10 @@ video {
     width: 75%;
   }
 
-  .md\:max-w-12 {
-    max-width: 3rem;
-  }
-
   .md\:max-w-7 {
     max-width: 1.75rem;
   }
 
-  .md\:items-center {
-    align-items: center;
-  }
-
   .md\:p-4 {
     padding: 1rem;
   }
@@ -1989,10 +1950,6 @@ video {
 }
 
 @media (min-width: 1024px) {
-  .lg\:flex {
-    display: flex;
-  }
-
   .lg\:h-32 {
     height: 8rem;
   }
@@ -2009,10 +1966,6 @@ video {
     width: 66.666667%;
   }
 
-  .lg\:items-center {
-    align-items: center;
-  }
-
   .lg\:px-32 {
     padding-left: 8rem;
     padding-right: 8rem;