DEV Community

Cover image for Finding the Perfect Destination in 24 Hours: My GitHub Copilot 1-Day Build Challenge Experience
Takuto Yuki
Takuto Yuki

Posted on

Finding the Perfect Destination in 24 Hours: My GitHub Copilot 1-Day Build Challenge Experience

This is a submission for the GitHub Copilot Challenge: Transitions and Transformations

What I Built

NextCompass is a web application designed to help users find their ideal relocation destination by answering a series of simple questions. Users can explore relocation options based on their preferences and even access real-time weather data and Google search suggestions for their chosen destination. This project showcases smooth transitions and dynamic user interactions, aligning perfectly with the theme of "Transitions and Transformations."

Demo

The app is live and fully functional! Check it out here:

https://next-compass.vercel.app/

Screenshots

  1. Top Screen The starting page of NextCompass. Users are invited to answer a series of questions to find their ideal relocation destination.

Image description

  1. Questionnaire Screen A simple and intuitive interface where users can answer questions about their preferences and lifestyle.

Image description

  1. Results Screen (City List) Based on the user's answers, a list of suggested relocation destinations is displayed. Users can click on any city to view more details.

Image description

  1. Detail Screen (City Information) Detailed information about a selected city, including current weather conditions and related data, is displayed to help users evaluate their options.

Image description

Repo

Explore the source code here:

GitHub Repository

Copilot Experience

GitHub Copilot significantly accelerated the development process by automating a substantial portion of the code generation, especially for API integrations.

Highlights of Copilot Usage:

  1. Efficient API Integration with Comments:

    I used comments to specify the API endpoints, and Copilot generated most of the required code for me. For example:

    • I wrote a comment like // https://api.unsplash.com/search/photos and Copilot generated the request logic, including parameter handling and response parsing.
    • Similarly, specifying endpoints for weather data and Google search queries led to Copilot producing nearly complete implementation.
  2. Backend Development Automation:

    For controllers and services, the initial implementation was largely auto-generated by Copilot based on endpoint comments. This allowed me to focus on testing and minor adjustments rather than writing boilerplate code.

  3. Streamlined Front-End and Back-End Workflow:

    Copilot inferred the structure of APIs from comments and type definitions, enabling seamless alignment between front-end components and backend logic.

By combining my detailed project guide (project-guide.md) with Copilot's powerful code generation capabilities, I was able to focus more on improving the app's user experience and functionality.

GitHub Models

I did not use GitHub Models for this project.

Conclusion

This project was completed comfortably within 24 hours. I started by creating a detailed guide for AI, which proved to be extremely helpful in keeping the AI-driven development process smooth and efficient.

And of course, it’s also incredibly useful for humans!

What I found particularly satisfying during this project is how well AI and I complemented each other. Personally, I enjoy tasks like fine-tuning animation effects, and it worked out perfectly because Copilot doesn’t excel in those areas. It created a balance where I could focus on the parts I love most, while AI took care of the repetitive or tedious tasks.

Though, let’s be honest—AI will probably surpass me in those areas soon enough. But until then, I’m enjoying this collaboration!

Top comments (0)