This repository contains a Google Colab notebook that utilizes the Gemini-Pro AI model to generate the HTML, CSS, and JavaScript onclick() function for a button. The JavaScript functionality occasionally produces unexpected but intriguing results. The notebook showcases several examples of this phenomenon.
- Gemini API Key
- A Google account with access to Google Colab (Google Colab)
- Basic understanding of Python 3
- Familiarity with HTML, CSS, and JavaScript concepts
- Clone the Repository: Clone this repository to your local machine using the following command:
git clone https://github.com/christcame/gemini-pro-button.git- Open in Google Colab: Upload the
gemini_pro_create_crazy_button.ipynbnotebook to your Google Colab environment.
-
Set up Gemini-Pro API: Refer to Gemini-Pro's documentation for instructions on setting up your API key and installing any necessary libraries within the Colab notebook.
-
Generated Output: In the notebook, the Gemini-Pro model creates:
- Button Text: AI-generated one-word text.
- Click Action: AI-generated JavaScript function called upon click.
- CSS: AI-generated CSS for the button.
-
Run the Code: Execute the code cells in the notebook. Gemini-Pro will process your input and generate the corresponding HTML, CSS, and JavaScript code.
-
Copy and Paste: Copy the generated code and paste it into your web development project.
Imagine you desire a button labeled "FART" that triggers an alert saying "Surprise!" and temporarily rotates your notebook 30 degrees when clicked. With Gemini AI, your unconventional button dreams can become a reality!
We welcome contributions to enhance this generator! Feel free to submit pull requests or open issues.
This project is licensed under the MIT License - see the LICENSE.md file for details.
Join me on Telegram! @ROCKMURPHY