DEV Community

Cover image for TouchGrass AI 🌱
Vikas
Vikas

Posted on

TouchGrass AI 🌱

Hacktoberfest Open-Source AI Challenge Week 1: Touch Grass Submission 🌿

Yes — you mean mention the actual links we already have, not placeholders. The only link I don't have from the conversation is the frontend Render URL.
Here is the complete version with all known links:
🌱 TouchGrass AI
This is a submission for the Hacktoberfest Open-Source AI Challenge Week 1: Touch Grass.
What I Built
I built TouchGrass AI, an AI-powered web app that helps people take a break from their screens and spend time outdoors.
The user provides a few simple details:

  • Available time
  • Mood
  • Energy level
  • Environment Based on these inputs, TouchGrass AI generates a realistic outdoor mission. For example, if someone has 30 minutes, wants to explore, and is on a college campus, the app can generate a small outdoor activity with simple steps and a rule to keep the phone away. The idea is simple: Use AI to help people spend less time on screens, not more. 🌱

Demo
🌐 Live Demo:
https://touchgrass-ai-frontend.onrender.com/
🔧 Backend:
https://touchgrass-ai-x6uh.onrender.com
❤️ Backend Health Check:
https://touchgrass-ai-x6uh.onrender.com/api/health
The backend is deployed separately from the frontend. The health-check endpoint confirms that the backend API is running.
Code
💻 GitHub Repository:
https://github.com/G-vikas8005/TouchGrass-AI
The repository contains the complete project source code, including the frontend and backend.
How I Built It
I built the frontend using React, Vite, Tailwind CSS, and Lucide React.
The backend uses Node.js, Express, CORS, and a REST API.
For the AI functionality, I used an open-weight AI model through Dahl's inference API.
The basic flow is:
User preferences → React frontend → Node.js backend → Dahl inference API → Generated outdoor mission
The backend handles the AI request so that the AI API key is not exposed in the frontend.
The generated mission includes:

  • Activity title
  • Description
  • Steps
  • Mission
  • Screen-free rule
  • Safety note The project is deployed on Render, with the frontend and backend running separately. Why Does Open Innovation Matter? Open innovation makes it easier for developers and students to experiment with AI and build useful applications. For this project, I was able to build a real application around an open-weight AI model and learn how to connect AI with a frontend, backend, and deployment. It also gives the project flexibility because the AI model or inference provider can be changed or improved later without rebuilding the entire application. My Agent Session I used AI-assisted development while building TouchGrass AI. DevRelay Agent Session: [Add your DevRelay session link here if you have one] This section is optional, so it can also be removed if you don't have a session link. Prize Categories
  • Hacktoberfest Open-Source AI Challenge
  • Touch Grass — Week 1 Links 🌱 Hacktoberfest Challenge: https://dev.to/challenges/hacktoberfest-week1-2026-10-05 💻 GitHub Repository: https://github.com/G-vikas8005/TouchGrass-AI 🔧 Backend: https://touchgrass-ai-x6uh.onrender.com ❤️ Backend Health Check: https://touchgrass-ai-x6uh.onrender.com/api/health

Top comments (0)