🏢 Job Postings

\n setNewJob({...newJob, title: e.target.value})}\n required\n />\n setNewJob({...newJob, company: e.target.value})}\n required\n />\n

setNewJob({...newJob, description: e.target.value})}\n            required\n          />\n          <button type=\"submit\">Post Job</button>\n        </form>\n        <div className=\"job-list\">\n          {jobs.map((job, index) => (\n            <div key={index} className=\"job-card\">\n              <h3>{job.title}</h3>\n              <p>{job.company}</p>\n              <p>{job.description}</p>\n            </div>\n          ))}\n        </div>\n      </div>\n      \n      <div className=\"chat-room\">\n        <h2>💬 Community Chat</h2>\n        <div className=\"message-list\">\n          {messages.map((msg, index) => (\n            <div key={index} className=\"message\">\n              <strong>{msg.username}: </strong>{msg.content}\n            </div>\n          ))}\n        </div>\n        <form onSubmit={submitMessage}>\n          <input \n            placeholder=\"Type a message\" \n            value={newMessage}\n            onChange={(e) => setNewMessage(e.target.value)}\n            required\n          />\n          <button type=\"submit\">Send</button>\n        </form>\n      </div>\n    </div>\n  );\n}\n\nfunction client() {\n  createRoot(document.getElementById(\"root\")).render(<App />);\n}\nif (typeof document !== \"undefined\") { client(); }\n\nexport default async function server(request: Request): Promise<Response> {\n  const { sqlite } = await import(\"https://esm.town/v/stevekrouse/sqlite\");\n  const KEY = new URL(import.meta.url).pathname.split(\"/\").at(-1);\n  const SCHEMA_VERSION = 2; // Increment schema version due to table change\n\n  await sqlite.execute(`\n    CREATE TABLE IF NOT EXISTS ${KEY}_jobs_${SCHEMA_VERSION} (\n      id INTEGER PRIMARY KEY AUTOINCREMENT,\n      title TEXT NOT NULL,\n      company TEXT NOT NULL,\n      description TEXT NOT NULL,\n      timestamp DATETIME DEFAULT CURRENT_TIMESTAMP\n    )\n  `);\n\n  await sqlite.execute(`\n    CREATE TABLE IF NOT EXISTS ${KEY}_messages_${SCHEMA_VERSION} (\n      id INTEGER PRIMARY KEY AUTOINCREMENT,\n      username TEXT NOT NULL,\n      content TEXT NOT NULL,\n      timestamp DATETIME DEFAULT CURRENT_TIMESTAMP\n    )\n  `);\n\n  if (request.method === 'POST' && new URL(request.url).pathname === '/jobs') {\n    const jobData = await request.json();\n    await sqlite.execute(\n      `INSERT INTO ${KEY}_jobs_${SCHEMA_VERSION} (title, company, description) VALUES (?, ?, ?)`,\n      [jobData.title, jobData.company, jobData.description]\n    );\n    return new Response(JSON.stringify({ success: true }), { \n      headers: { 'Content-Type': 'application/json' } \n    });\n  }\n\n  if (request.method === 'POST' && new URL(request.url).pathname === '/messages') {\n    const messageData = await request.json();\n    await sqlite.execute(\n      `INSERT INTO ${KEY}_messages_${SCHEMA_VERSION} (username, content) VALUES (?, ?)`,\n      [messageData.username, messageData.content]\n    );\n    return new Response(JSON.stringify({ success: true }), { \n      headers: { 'Content-Type': 'application/json' } \n    });\n  }\n\n  if (request.method === 'GET' && new URL(request.url).pathname === '/jobs') {\n    const jobs = await sqlite.execute(\n      `SELECT * FROM ${KEY}_jobs_${SCHEMA_VERSION} ORDER BY timestamp DESC LIMIT 10`\n    );\n    return new Response(JSON.stringify(jobs.rows), { \n      headers: { 'Content-Type': 'application/json' } \n    });\n  }\n\n  if (request.method === 'GET' && new URL(request.url).pathname === '/messages') {\n    const messages = await sqlite.execute(\n      `SELECT * FROM ${KEY}_messages_${SCHEMA_VERSION} ORDER BY timestamp DESC LIMIT 20`\n    );\n    return new Response(JSON.stringify(messages.rows), { \n      headers: { 'Content-Type': 'application/json' } \n    });\n  }\n\n  return new Response(`\n    <html>\n      <head>\n        <title>Job Board & Community Chat</title>\n        <style>${css}</style>\n      </head>\n      <body>\n        <div id=\"root\"></div>\n        <script src=\"https://esm.town/v/std/catch\"></script>\n        <script type=\"module\" src=\"${import.meta.url}\"></script>\n      </body>\n    </html>\n  `, {\n    headers: { 'Content-Type': 'text/html' }\n  });\n}\n\nconst css = `\nbody {\n  font-family: Arial, sans-serif;\n  margin: 0;\n  padding: 20px;\n  background-color: #f4f4f4;\n}\n.container {\n  display: flex;\n  gap: 20px;\n  position: relative;\n}\n.job-board, .chat-room {\n  background: white;\n  border-radius: 8px;\n  padding: 20px;\n  width: 50%;\n  box-shadow: 0 2px 5px rgba(0,0,0,0.1);\n}\nform {\n  display: flex;\n  flex-direction: column;\n  gap: 10px;\n  margin-bottom: 20px;\n}\ninput, textarea {\n  padding: 10px;\n  border: 1px solid #ddd;\n  border-radius: 4px;\n}\nbutton {\n  background-color: #4CAF50;\n  color: white;\n  border: none;\n  padding: 10px;\n  border-radius: 4px;\n  cursor: pointer;\n}\n.job-list, .message-list {\n  max-height: 400px;\n  overflow-y: auto;\n}\n.job-card, .message {\n  background-color: #f9f9f9;\n  border-radius: 4px;\n  padding: 10px;\n  margin-bottom: 10px;\n}\n.username-modal {\n  position: fixed;\n  top: 0;\n  left: 0;\n  width: 100%;\n  height: 100%;\n  background: rgba(0,0,0,0.5);\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  z-index: 1000;\n}\n.username-modal form {\n  background: white;\n  padding: 20px;\n  border-radius: 8px;\n  width: 300px;\n  text-align: center;\n}\n`;","createdAt",["D",1739806759844],"version",3,"currentUserHasLiked","likeCount","forkCount","referenceCount","dependencyCount",1,"commentCount","prCount","mergedPr",{"_129":130,"_131":132},"handle","user04","profileImageUrl","https://img.clerk.com/eyJ0eXBlIjoicHJveHkiLCJzcmMiOiJodHRwczovL2ltYWdlcy5jbGVyay5kZXYvb2F1dGhfZ2l0aHViL2ltZ18ydEFvRGxqdVBTMEFPV1N1MldEdHhlWTQ5S2cifQ","forkedVal","interval","slug","user04/jobboard","description","@jsxImportSource https://esm.sh/react@18.2.0","versions",[141,144,147,150],{"_117":118,"_142":-5,"_115":143,"_112":110},"prId",["D",1739806759844],{"_117":90,"_142":-5,"_115":145,"_112":146},["D",1739805802680],"1ffb97e4-ed43-11ef-a98f-e6cdfca9ef9f",{"_117":124,"_142":-5,"_115":148,"_112":149},["D",1739805495417],"68d64ffa-ed42-11ef-af07-e6cdfca9ef9f",{"_117":31,"_142":-5,"_115":151,"_112":152},["D",1739805300264],"f485d18e-ed41-11ef-aa77-e6cdfca9ef9f","recentThread","breadcrumbs","comments",[],"isOwner","routes/_app.v.$handle.$name.pulls._index",{"_95":96,"_94":160,"_129":130,"_137":138,"_98":99,"_172":31,"_173":31,"_50":51,"_174":175},{"_98":99,"_95":96,"_100":101,"_102":-5,"_103":-5,"_104":105,"_106":-5,"_107":108,"_109":110,"_111":26,"_112":110,"_113":114,"_115":161,"_117":118,"_119":26,"_120":31,"_121":31,"_122":31,"_123":124,"_125":31,"_126":31,"_127":-5,"_20":162,"_133":-5,"_134":-7,"_135":136,"_137":138,"_139":163},["D",1739806759844],{"_129":130,"_131":132},[164,166,168,170],{"_117":118,"_142":-5,"_115":165,"_112":110},["D",1739806759844],{"_117":90,"_142":-5,"_115":167,"_112":146},["D",1739805802680],{"_117":124,"_142":-5,"_115":169,"_112":149},["D",1739805495417],{"_117":31,"_142":-5,"_115":171,"_112":152},["D",1739805300264],"page","count","prs",[],"routes/_app","actionData","errors"]
</article></body></html>

Choose a Username

🏢 Job Postings