Subproject Template

This template demonstrates how to create a subproject that works with the parent project routing architecture.

• Parent Project Template: https://www.val.town/x/dcm31/parentProjectTemplate/code/
• Subproject Template: https://www.val.town/x/dcm31/subprojectTemplate/code/

This subproject is designed to be accessed through a parent project via path-based routing. It includes:

• Automatic path handling for both direct and proxied requests
• Navigation between subproject pages
• Navigation back to the parent project
• Simple page routing system

1. Clone/fork this template for each subproject you want to create
2. Update the config object in http.tsx to match your project's name and path
   • Change the name field to your subproject's name
   • Change the basePath field to match the path you'll use in the parent project
   • Example: If your path will be /my-app, change basePath to /my-app
3. Deploy your subproject and note its endpoint URL
4. Add your subproject's endpoint to the parent project's proxies.tsx file (see integration section below)
5. Customize the pages and content to fit your needs

When remixing this template, you'll need to update:

1. http.tsx:
   • Update the config object at the top of the file
   • Customize the page components (HomePage, AboutPage, etc.)
   • Add or modify routes as needed

After deploying your subproject, you'll need to find its endpoint URL to use in the parent project:

1. Look at the "endpoint" information for your HTTP file
2. It will be in the format: https://username--endpoint-id.web.val.run
3. This full URL will be needed in the parent project's proxies.tsx file

To connect this subproject with a parent project:

1. Get your subproject's endpoint URL (available after deployment)
2. Add an entry to the proxyRoutes array in the parent project's proxies.tsx:

{
  pattern: '/your-subproject-path',  // Must match basePath in your config
  target: 'https://your-username--endpoint-id.web.val.run',  // Your subproject endpoint
  name: 'Your Subproject Name'  // Display name
}

This template automatically handles paths whether accessed directly or through the parent project:

• If accessed via parent: parentdomain.com/subproject/about
• If accessed directly: subproject-endpoint.web.val.run/about

Both scenarios are properly handled by the path processing logic in the request handler.

• Clean separation of concerns
• Independent development and deployment
• Shared navigation and user experience
• No need for complex domain configuration