DEV Community: Antonio The latest articles on DEV Community by Antonio (@viajapptravel). https://dev.to/viajapptravel https://media2.dev.to/dynamic/image/width=90,height=90,fit=cover,gravity=auto,format=auto/https:%2F%2Fdev-to-uploads.s3.us-east-2.amazonaws.com%2Fuploads%2Fuser%2Fprofile_image%2F4035075%2F894e4727-42b9-481b-93c9-24ba801c2774.png DEV Community: Antonio https://dev.to/viajapptravel en How I Built a Japan Travel App with Next.js and FastAPI Antonio Mon, 20 Jul 2026 12:20:49 +0000 https://dev.to/viajapptravel/how-i-built-a-japan-travel-app-with-nextjs-and-fastapi-ali https://dev.to/viajapptravel/how-i-built-a-japan-travel-app-with-nextjs-and-fastapi-ali <h1> How I Built a Japan Travel App with Next.js and FastAPI </h1> <p>Last year I decided to plan a trip to Japan. I quickly realized that information about Japan travel is scattered across dozens of websites, each with different formats and outdated prices.</p> <p>So I built <strong>ViajApp</strong> - a complete Japan travel platform with API, web app, and soon mobile.</p> <h2> The Stack </h2> <ul> <li> <strong>Frontend</strong>: Next.js 16 with TypeScript</li> <li> <strong>Backend</strong>: FastAPI (Python)</li> <li> <strong>Database</strong>: Supabase (PostgreSQL)</li> <li> <strong>Hosting</strong>: Vercel + Render</li> </ul> <h2> Features I Built </h2> <h3> 1. Restaurant Search with Serper API </h3> <p>Real-time search for restaurants, temples, and attractions using Google Places data.</p> <h3> 2. Currency Converter </h3> <p>Live exchange rates updated daily. No more mental math at konbini.</p> <h3> 3. Transport Calculator </h3> <p>Calculate the best route between cities with JR Pass recommendations.</p> <h3> 4. Blog Auto-Generation </h3> <p>This article you're reading was automatically generated and posted via GitHub Actions. Every week, a new article about Japan travel is created and published to both the website and Dev.to.</p> <h3> 5. Emergency Info </h3> <p>Real-time weather, emergency numbers, and hospital finder for each region.</p> <h2> The API </h2> <p>The backend has 40+ endpoints covering:</p> <ul> <li>Culture guides</li> <li>Food recommendations </li> <li>Budget calculator</li> <li>Event finder</li> <li>Transport info</li> <li>Emergency services</li> </ul> <h2> Lessons Learned </h2> <ol> <li> <strong>Start with the data</strong>: Before writing code, I collected all the Japan travel information I could find</li> <li> <strong>API-first design</strong>: Building the API first made the frontend much easier</li> <li> <strong>Automation is key</strong>: The blog auto-generation saves hours every week</li> <li> <strong>SEO matters</strong>: Each article has metadata, tags, and structured content</li> </ol> <h2> What's Next </h2> <ul> <li>Mobile app (React Native)</li> <li>AI-powered itinerary generator</li> <li>More countries (Greece, Italy, Spain)</li> </ul> <h2> Try It </h2> <p>🌐 <strong>Web</strong>: <a href="https://www.viajapp.app" rel="noopener noreferrer">viajapp.app</a><br> 📡 <strong>API</strong>: <a href="https://japan-travel-api.onrender.com" rel="noopener noreferrer">japan-travel-api.onrender.com</a></p> <p><em>Built with love for Japan 🇯🇵</em></p> webdev javascript react buildinpublic How I Built a Japan Travel App with Next.js and FastAPI Antonio Sat, 18 Jul 2026 10:12:18 +0000 https://dev.to/viajapptravel/how-i-built-a-japan-travel-app-with-nextjs-and-fastapi-1m7h https://dev.to/viajapptravel/how-i-built-a-japan-travel-app-with-nextjs-and-fastapi-1m7h <h1> How I Built a Japan Travel App with Next.js and FastAPI </h1> <p>Last year I decided to plan a trip to Japan. I quickly realized that information about Japan travel is scattered across dozens of websites, each with different formats and outdated prices.</p> <p>So I built <strong>ViajApp</strong> - a complete Japan travel platform with API, web app, and soon mobile.</p> <h2> The Stack </h2> <ul> <li> <strong>Frontend</strong>: Next.js 16 with TypeScript</li> <li> <strong>Backend</strong>: FastAPI (Python)</li> <li> <strong>Database</strong>: Supabase (PostgreSQL)</li> <li> <strong>Hosting</strong>: Vercel + Render</li> </ul> <h2> Features I Built </h2> <h3> 1. Restaurant Search with Serper API </h3> <p>Real-time search for restaurants, temples, and attractions using Google Places data.</p> <h3> 2. Currency Converter </h3> <p>Live exchange rates updated daily. No more mental math at konbini.</p> <h3> 3. Transport Calculator </h3> <p>Calculate the best route between cities with JR Pass recommendations.</p> <h3> 4. Blog Auto-Generation </h3> <p>This article you're reading was automatically generated and posted via GitHub Actions. Every week, a new article about Japan travel is created and published to both the website and Dev.to.</p> <h3> 5. Emergency Info </h3> <p>Real-time weather, emergency numbers, and hospital finder for each region.</p> <h2> The API </h2> <p>The backend has 40+ endpoints covering:</p> <ul> <li>Culture guides</li> <li>Food recommendations </li> <li>Budget calculator</li> <li>Event finder</li> <li>Transport info</li> <li>Emergency services</li> </ul> <h2> Lessons Learned </h2> <ol> <li> <strong>Start with the data</strong>: Before writing code, I collected all the Japan travel information I could find</li> <li> <strong>API-first design</strong>: Building the API first made the frontend much easier</li> <li> <strong>Automation is key</strong>: The blog auto-generation saves hours every week</li> <li> <strong>SEO matters</strong>: Each article has metadata, tags, and structured content</li> </ol> <h2> What's Next </h2> <ul> <li>Mobile app (React Native)</li> <li>AI-powered itinerary generator</li> <li>More countries (Greece, Italy, Spain)</li> </ul> <h2> Try It </h2> <p>🌐 <strong>Web</strong>: <a href="https://japan-travel-web-lime.vercel.app" rel="noopener noreferrer">japan-travel-web-lime.vercel.app</a><br> 📡 <strong>API</strong>: <a href="https://japan-travel-api.onrender.com" rel="noopener noreferrer">japan-travel-api.onrender.com</a></p> <p><em>Built with love for Japan 🇯🇵</em></p> webdev javascript react buildinpublic