$ git diff
src/app/page.tsx
src/components/about.tsx
$ git addsrc/app/page.tsx $
$ git commit -m'feat: add about page'
$ git push
$ git diff
src/app/page.tsx
src/components/about.tsx
$ git addsrc/app/page.tsx $
$ git commit -m'feat: add about page'
$ git push
Stack principal: Next.js (React) + TypeScript
Estilização com TailwindCSS
Validação de formulários usando Zod
Monitoramento de erros com Sentry
Deploy via Vercel (pelo endereço público)
O que é: Funcionalidade central do produto que permite aos usuários marcar consultas.
Implementação:
O que é: Interface administrativa para médicos gerenciarem sua agenda.
Implementação:
O que é: Sistema robusto para garantir integridade dos dados.
Implementação:
O que é: Sistema de captura e análise de problemas em produção.
Implementação:
O que é: Proteção de dados sensíveis e configurações do ambiente.
Implementação:
.env.localAqui vão alguns trechos ou exemplos fictícios (baseados no repositório) de como certas partes poderiam estar ou estão feitas:
// Exemplo de schema Zod para validar formulário de agendamento
import { z } from "zod";
const AppointmentSchema = z.object({
patientName: z.string().min(1, "Nome obrigatório"),
doctorId: z.string().uuid("Formato inválido"),
date: z
.string()
.refine((val) => /* checa formato ou parse */ true, "Data inválida"),
time: z.string().optional(), // ou outro formato
});
// dentro de uma rota API do Next.js
export async function handler(req, res) {
const parsed = AppointmentSchema.safeParse(req.body);
if (!parsed.success) {
return res.status(400).json({ errors: parsed.error.issues });
}
// seguir com lógica de salvar no banco, etc.
}
// Exemplo de uso de componente React com Tailwind, formulário, mostrando erros
function AppointmentForm() {
const [formData, setFormData] = useState({
patientName: "",
doctorId: "",
date: "",
});
const [errors, setErrors] = useState<{ [key: string]: string }>({});
const onSubmit = async () => {
const result = AppointmentSchema.safeParse(formData);
if (!result.success) {
const issues = result.error.issues;
const newErrors: { [key: string]: string } = {};
issues.forEach((issue) => {
newErrors[issue.path.join(".")] = issue.message;
});
setErrors(newErrors);
return;
}
// chamada fetch para API do Next.js...
};
return (
<form
onSubmit={(e) => {
e.preventDefault();
onSubmit();
}}
>
<input
className="p-2 border rounded"
name="patientName"
value={formData.patientName}
onChange={(e) =>
setFormData((prev) => ({ ...prev, patientName: e.target.value }))
}
/>
{errors.patientName && (
<p className="text-red-500">{errors.patientName}</p>
)}
{/* demais campos... */}
<button type="submit" className="mt-4 bg-blue-500 text-white rounded p-2">
Agendar
</button>
</form>
);
}
Tratamento de Erros
Testes