FeedMe (The short name of Give Feedback to Me) is a web-based form-building and response collection platform built with Flask. Users can easily create custom forms, share them, and collect responses. The platform includes an interactive dark-themed UI and offers a smooth, professional user experience.
- Features
- Project Structure
- Installation
- Screenshots (Will be added soon)
- License
- Contact
- User Authentication: Secure login and access control with Flask-Login.
- Custom Forms: Create dynamic forms and share them with others.
- Response Management: View structured responses in a scrollable table format.
- Dark Mode UI: Sleek, modern design with a futuristic dark theme.
- Modular Codebase: Organized Flask application for scalability.
- Security: Prevents password pasting, ensuring secure login.
feedme/
├── pack/ # Main application directory
│ ├── static/ # Static files (CSS, JS, images)
│ │ ├── css/ # Stylesheets for various pages
│ │ │ ├── answer.css # Styling for the answer page
│ │ │ ├── form.css # Styling for the form creation page
│ │ │ ├── home.css # Styling for the home page
│ │ │ ├── login.css # Styling for the login page
│ │ │ ├── profile.css # Styling for the user profile page
│ │ │ ├── register.css # Styling for the register page
│ │ │ └── viewans.css # Styling for the response table page
│ │ ├── js/ # JavaScript files for frontend functionality
│ │ │ ├── form.js # JS for the form creation page
│ │ │ ├── home.js # JS for the home page
│ │ │ ├── login.js # JS for the login page
│ │ │ ├── nopaste.js # JS to restrict copy-pasting on certain fields
│ │ │ └── viewans.js # JS for the response page
│ │ ├── img/ # Images for the app (e.g., backgrounds, icons)
│ │ │ ├── nebula.jpg # Background image for the login page
│ │ │ ├── formbg.jpg # Background image for the form page
│ │ │ ├── formbg2.jpg # Alternative background image for the form page
│ │ │ ├── sponsor.png # Banner for project attribution (W3Nabil)
│ │ │ ├── default-cover.jpg # Default cover picture for forms
│ │ │ └── default-profile.png # Default profile picture for users
│ ├── public/ # HTML templates for various pages
│ │ ├── answerform.html # Template for the form answer page
│ │ ├── viewans.html # Template for the response table page
│ │ ├── error.html # Custom 404 error page
│ │ ├── home.html # Template for the logged-in user's home page
│ │ ├── login.html # Template for the login/sign-in page
│ │ ├── makeform.html # Template for the form creation page
│ │ ├── nojs.html # Template for users with JS disabled
│ │ └── register.html # Template for the sign-up/register page
├── models.py # Database models for form questions and answers
├── __init__.py # Initializes the app and its components
├── db_custom.py # Custom database queries and logic
├── views.py # URL routes for various pages and actions
├── auth.py # Authentication routes (login, logout, register)
├── .env # Environment variables for app secrets
├── app.py # Main entry point for running the app
├── requirements.txt # List of required Python packages
├── README.md # Project documentation and overview
└── License # Project's licensing information
Before you begin, make sure that you have the following installed on your system:
- Python 3.8+
- pip (Python package installer)
You can check if you have Python and pip installed by running the following commands in your terminal:
python --versionpip --version[Additionally, it's recommended to set up a virtual environment to manage dependencies.]
- Clone the Repository:
First, clone the repository to your local machine:
git clone https://github.com/w3nabil/feedme.git
cd feedme- Install the Required Dependencies:
You can install all necessary dependencies by using pip:
pip install -r requirements.txt- Configure the Environment:
Create a .env file in the root directory of the project and configure your environment variables, such as the Flask secret key and database credentials.
Example .env file:
secret=your_app_secret_key
db_uri=your_database_url- Run the Application:
After setting up the environment, you can start the Flask server:
python app.py- Access the app:
Open your browser and navigate to http://127.0.0.1:5000/ or http://localhost:5000/ to access the application.
- Login Security: Prevents password pasting to secure login forms.
- Restricted Access: Only form creators can view the responses.
- Flask-Login: Ensures users are authenticated before interacting with the app.
- 2FA: Requires a secondary password to login.
This web application is free, open-source, and is provided as-is. It comes with no warranty or guarantees. By using this web app, you acknowledge that you are doing so at your own risk.
I am not responsible for any damages, data loss, or issues that may arise from using this web app.
Please make sure to review and modify the web application as necessary to fit your needs.
This project is open-source and licensed under the MIT License.
For any questions or feedback, please contact me at
Learn more about @w3nabil
This project was mainly for fun by me. I never imagined that my practice project can turn into a useful web-app. However, if you plan to use this project, please mention my github username in the credit if possible and star this repo.
Thank you for using Project FeedMe!