My Vibe Coding Experience: Creating Employee Finder AI with Lovable AI’s Help.Learning through Vibe Coding : Finder Project Built With Lovable AI Assistance.
This project was generated using Lovable. I did not write the core code, but I deployed and branded it to explore ethical AI-assisted workflows. All authorship is transparently credited.
URL: https://lovable.dev/projects/4bca529b-1bb4-45dc-acb7-47fc00e1572a
There are several ways of editing your application.
Use Lovable
Simply visit the Lovable AI Project and start prompting.
Changes made via Lovable will be committed automatically to this repo.
🚧 Why I Built This
- As someone learning to build real-world applications, I wanted to focus on understanding product design, data flow, and AI tool integration — instead of starting purely with code. Lovable allowed me to:
- Prototype a real-world solution quickly
- Focus on logic, flow, and user experience
- Learn how AI tools can assist development
- Understand how to structure apps without needing to manually code every part
🧠 What I Learned
- How no-code AI tools work in practice
- Basics of app logic and workflow automation
- Importance of UI/UX in functional web apps
- How to communicate between front-end features and backend data (even if assisted)
💡 Future Plans
- Rebuild parts of the app manually (e.g. using React or Next.js)
- Add database integration (e.g. Firebase, MongoDB)
- Add authentication and user roles
- Improve matching algorithm manually
📌 Disclaimer
This project was built with the help of the Lovable AI platform. Some parts of the logic and UI were generated or assisted by the platform. I focused on understanding the app's structure, features, and the role of AI in accelerating development. This project is part of my learning journey in tech and software development.
Use your preferred IDE
If you want to work locally using your own IDE, you can clone this repo and push changes. Pushed changes will also be reflected in Lovable.
The only requirement is having Node.js & npm installed - install with nvm
Follow these steps:
# Step 1: Clone the repository using the project's Git URL.
git clone <YOUR_GIT_URL>
# Step 2: Navigate to the project directory.
cd <YOUR_PROJECT_NAME>
# Step 3: Install the necessary dependencies.
npm i
# Step 4: Start the development server with auto-reloading and an instant preview.
npm run devEdit a file directly in GitHub
- Navigate to the desired file(s).
- Click the "Edit" button (pencil icon) at the top right of the file view.
- Make your changes and commit the changes.
Use GitHub Codespaces
- Navigate to the main page of your repository.
- Click on the "Code" button (green button) near the top right.
- Select the "Codespaces" tab.
- Click on "New codespace" to launch a new Codespace environment.
- Edit files directly within the Codespace and commit and push your changes once you're done.
This project is built with:
- Vite
- TypeScript
- React
- shadcn-ui
- Tailwind CSS
Simply open Lovable and click on Share -> Publish.
🙋♂️ About Me
I'm a learner exploring software development, AI tools, and real-world problem solving through projects. Always open to feedback and collaboration!
Read more here: Setting up a custom domain