aewing
c33ee3dfe7
- Create modular project structure with src/backend, src/frontend, public - Hono server with routing, static file serving, and API endpoints - TailwindCSS styling pipeline with Tailwind CLI - Vanilla JS frontend (extensible for frameworks) - Complete TypeScript configuration and type checking - Auth module as self-contained submodule - Ready for development: bun run dev (port 3000) - All dependencies installed and tested Also: - Lock main branch with read-only settings in VS Code - Create .github/copilot-instructions.md with Monica persona - Initialize session logging system Status: Project ready for feature development
43 lines
1.5 KiB
JavaScript
43 lines
1.5 KiB
JavaScript
// Frontend entry point
|
|
// This is where your application logic starts
|
|
|
|
const app = document.getElementById('app');
|
|
|
|
if (app) {
|
|
app.innerHTML = `
|
|
<div class="min-h-screen flex flex-col items-center justify-center bg-gradient-to-br from-blue-50 to-indigo-100">
|
|
<div class="bg-white rounded-lg shadow-lg p-8 max-w-md w-full">
|
|
<h1 class="text-3xl font-bold text-gray-800 mb-2">NewApproach</h1>
|
|
<p class="text-gray-600 mb-6">Full-stack TypeScript + Hono + TailwindCSS</p>
|
|
|
|
<button
|
|
id="fetchBtn"
|
|
class="w-full bg-blue-500 hover:bg-blue-600 text-white font-semibold py-2 px-4 rounded transition"
|
|
>
|
|
Fetch API Info
|
|
</button>
|
|
|
|
<div id="result" class="mt-6 p-4 bg-gray-50 rounded hidden">
|
|
<pre id="resultContent" class="text-sm text-gray-700 whitespace-pre-wrap"></pre>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
`;
|
|
|
|
// temporary: basic API integration example
|
|
document.getElementById('fetchBtn').addEventListener('click', async () => {
|
|
try {
|
|
const response = await fetch('/api/info');
|
|
const data = await response.json();
|
|
|
|
const resultDiv = document.getElementById('result');
|
|
const resultContent = document.getElementById('resultContent');
|
|
|
|
resultContent.textContent = JSON.stringify(data, null, 2);
|
|
resultDiv.classList.remove('hidden');
|
|
} catch (error) {
|
|
console.error('Error fetching API:', error);
|
|
}
|
|
});
|
|
}
|