DevEx Tools

Welcome to DevEx Tools, a comprehensive suite of utilities designed to enhance the experience of front-end developers. Our web app offers seven distinct tools aimed at streamlining your workflow and boosting your productivity. Whether you're adjusting styles with a color picker, generating CSS for gradients and shadows, looking for the perfect font, finding special characters, creating HTML tables, or converting CSS units with precision, DevEx Tools has you covered.

Features

DevEx Tools includes the following utilities:

• Color Picker: Easily select and copy colors in various formats.
• Gradient Maker: Create beautiful CSS gradients with live previews.
• Shadow Creator: Customize and apply box shadows with a few clicks.
• Character Finder: Quickly find and use special characters in your projects.
• Table Generator: Effortlessly create HTML tables tailored to your needs.
• Unit Converter: Convert between CSS units with ease.
• Font Viewer: Preview and choose fonts that best fit your design.

Each tool provides handy code snippets for seamless integration into your projects. Plus, with our "Go Deeper" section, you can explore educational links to expand your knowledge with each tool. You can also bookmark and save your favorite customizations to your collection for easy access later on.

App Experience

Visit DevEx Tools online here to experience the tools firsthand. Below, you will find screenshots of the Gradient Maker page.

Tech Stack

• React
• Vite
• Tailwind CSS

Getting Started

Follow these steps to get DevEx Tools running on your local machine:

1. Clone the repository:

   Use the following command to clone the project repository to your local system: git clone https://github.com/chingu-voyages/v47-tier2-team-17.git

2. Navigate to the project directory: After cloning, move into the 'fetools-app' directory by running: cd fetools-app

3. Install dependencies: Install the project's dependencies to ensure it runs smoothly: npm install

4. Start the development server: Launch the application in development mode with Vite: npm run dev

This command starts a local development server. Open http://localhost:5173 in your browser to view the app.

By following these steps, you should have a local instance of DevEx Tools running and ready for development or exploration.

Contributors

• @david-nyc-pm - Product Owner
• @joekotvas - UI/UX Designer & Developer
• @amansinghgill - Developer
• @Greimil - Developer
• @imadrig - Developer
• @olegklyufinskyy - Developer
• @Stevensauro - Developer