biilmann
    biilmann/geosim
    Public

    Fork

    About

    Generates GeoCities style web pages GeoSimCities.netlify.app

    netlify
    langbase

    Meta

    generate

    No variables defined in the prompt.

    Tools

    No tools added to the Pipe.

    Readme

    Langbase and Netlify collaboration

    GeoSimCities is an AI agent built for developers to easily recreate retro GeoCities-style websites. Using just a URL input, GeoSimCities generates fully functional, 90s-inspired web pages in minutes. Built with ⌘ Langbase's advanced AI agent pipes, it brings back the bold, quirky web designs of the GeoCities era with minimal effort.

    How GeoSimCities AI Agent Pipe Works?

    This is a Generate pipe that works with 30+ LLMs (OpenAI, Gemini, Mistral, Llama, Gemma, etc), any Data (10M+ context with Memory sets), and any Framework (standard web API you can use with any software) to generate GeoCities-inspired web pages based on URLs provided by users.

    With this pipe, developers can quickly create websites that capture the look, feel, and quirky design of the original GeoCities.

    Check out the live demo here.

    Key Features

    • 🙌 AI-Generated GeoCities Pages: Provide a URL, and GeoSimCities generates a fully functioning web page styled like a classic GeoCities site.
    • Real-Time Web Creation: Experience the creation of a website in real-time using Langbase and Netlify.
    • 📄 Customizable HTML & JavaScript: This AI agent pipe generates inline CSS and JavaScript, allowing for a complete and dynamic web experience.
    • 🔗 Link to Other Websites: Easily add external links, just like the link networks on classic GeoCities sites.
    • 📊 Automatic Image Attributes: This AI agent pipe handles image width and height attributes for a retro, authentic look.
    • 🔋 Responsive and open source: Works on all devices and platforms.

    Use Cases and Benefits

    • Retro Website Recreation: Perfect for those looking to bring back the aesthetics and nostalgia of the '90s web.
    • Rapid Prototyping: Quickly generate and test web page designs for any project. One good example of this is React based app.
    • Educational Tool: Useful for beginners to explore web design in a simplified format.
    • Creative Exploration: Langbase AI agent pipes lets you experiment with different designs and layouts. Checkout our examples here.

    Limitations and Considerations

    • Customization Constraints: While this AI agent pipe provides creative freedom, advanced users may find the customization options somewhat limited compared to traditional web development.
    • Hosting Requirements: The generated code needs to be hosted on platforms like Netlify for public accessibility.

    Getting Started

    To start using the GeoSimCities AI agent pipe:

    1. Fork the Pipe: Fork the GeoSimCities pipe on Langbase.
    2. Copy the API Key: Navigate to the API tab to get your pipe’s API key.
    3. Set Up the Example Project: Download or clone the example project in your code editor.
    4. Environment Configuration: In your project’s root directory, create a .env.local file with the following environment variable:
    1LANGBASE_API_KEY="your-pipe-api-key"
    1. Deploy on Netlify: Run and deploy the project on Netlify after configuring your Langbase API key.

    Learn More

    Authors

    This project was live coded by Mathias Biilmann, Co-Founder of Netlify, during the Sourcegraph AI Dev Tools gathering. The project leverages Langbase AI agent pipes and modern AI tools like Sourcegraph Cody.