Secure Encoder is a sophisticated web application crafted to provide robust encoding and decryption capabilities using various cryptographic algorithms, including AES and RSA. The application supports a variety of operations such as Base64, Hex, UTF-8, Latin-1, ASCII, and URL encoding/decoding.
Its primary goal is to offer a user-friendly interface for secure text manipulation, catering especially to developers and security professionals who require reliable and secure methods for data manipulation in web applications. This makes it particularly useful for those who need quick encoding and decoding solutions alongside robust encryption tools to ensure data safety.
Developed using Python Flask and React, and leveraging SQLalchemy with Vite and Tailwind CSS for the front end, Secure Encoder exemplifies the effective use of test-driven development (TDD) practices, advanced data structures and algorithms, and expert deployment techniques.
- Dynamic Encoding/Decoding: Support for multiple encoding schemes including Base64, Hex, and more.
- Encryption and Decryption: Implements AES and RSA algorithms with key management for secure data handling.
- File Uploads: Users can upload key files needed for encryption/decoding.
- Interactive UI: The React-based interactive UI ensures a smooth user experience.
- Security: Implements best practices like Content Security Policy headers.
| Component | Technology Used | Description |
|---|---|---|
| Frontend | React.js, TypeScript | Interactive UI built with React |
| Backend | Flask (Python) | Server-side logic handled by Flask |
| CSS Framework | Tailwind | Styling provided by Tailwind CSS |
| Database | sqlalchemy | ORM for database interactions (if used) |
| CI/CD | Codecov, Codacy, CodeQL | Continuous integration and deployment |
| Containerization | Docker, Docker Compose (optional) | Container setup for development and production environments |
- Node.js (v14 or later)
- npm (Node Package Manager)
- Python (3.8 or later)
-
Clone the repository:
git clone git@github.com:clchinkc/SecureEncoder.git
-
Set environment variables: Update the
.envfile in the SecureEncoderReact directory or the src file inside SecureEncoderFlask directory if necessary.
-
Navigate to the
SecureEncoderFlaskdirectory.cd SecureEncoderFlask -
Set up the backend for the first time running:
pip install -r requirements.txt
-
Run the Flask application:
python run.py
This will launch the backend on
http://localhost:5000.
-
Open a new terminal and navigate to the
SecureEncoderReactdirectory.cd SecureEncoderReact -
Set up the frontend for the first time running:
npm install
-
Start the React application:
npm run dev
Build and start the built application:
npm run build npm run serve
Or to run the production build on local static server:
npx serve -s build
This will launch the web application on
http://localhost:3000and connect it to the Flask backend.
This project sets up a React frontend application using Docker and Docker Compose for development with hot reloading.
Follow these instructions to get the React frontend application up and running in a Docker container.
Use Docker Compose to build and start the container:
docker-compose up --buildOpen your browser and navigate to:
http://localhost:3000Open your browser and navigate to:
docker-compose down- Keep your cryptographic keys secure and ensure they are not exposed to unauthorized users.
- Regularly update dependencies to mitigate vulnerabilities associated with outdated libraries.
- Fork the Project
- Create your Feature Branch (
git checkout -b feature/AmazingFeature) - Commit your Changes (
git commit -m 'Add some AmazingFeature') - Push to the Branch (
git push origin feature/AmazingFeature) - Open a Pull Request
Distributed under the MIT License. See LICENSE.txt for more information.