Skip to content

CodingProject.md

Latest commit

 

History

History
136 lines (101 loc) · 3.72 KB

CodingProject.md

File metadata and controls

136 lines (101 loc) · 3.72 KB

🐱 Cat Fact Tracker – New Hire Intro Project

Welcome! This project is a small full-stack application to help you get comfortable with the technologies we use and to evaluate your skills in a real-world scenario.

You’ll build a backend with FastAPI, a local SQLite database, a Python script that fetches cat facts from an external API, and a React frontend to interact with your backend.

🎯 Project Overview

Goal: Build a simple app that:

  • Pulls random cat facts from https://catfact.ninja/fact
  • Saves those facts in a local SQLite database using a standalone script
  • Exposes them through a FastAPI backend
  • Displays and submits facts via a React frontend

🧰 Required Tools

Make sure you have the following installed:

Tool Version Download
Python 3.10+ https://www.python.org/downloads/
Node.js 18+ https://nodejs.org/en/download/
npm Comes with Node.js

📁 Suggested Project Structure

INTROPROJECT/
├── backend/
│   ├── import_cat_facts.py       # Script to fetch and store cat facts
│   ├── db.py                     # DB logic (create, insert, fetch)
│   ├── main.py                   # FastAPI backend
│   └── cat_facts.db              # SQLite database (generated by your code)
├── frontend/                     # React app (set up however you prefer)
│   └── [your React files]
├── requirements.txt              # Python dependencies

🐍 Part 1: Python Script – import_cat_facts.py

Create a Python script that:

  1. Fetches 5 cat facts from https://catfact.ninja/fact
  2. Extracts the "fact" field from each response
  3. Saves the facts to a local SQLite database
    • Avoid inserting duplicates
    • Print a message for each inserted or skipped fact

SQLite Table

CREATE TABLE cat_facts (
    id INTEGER PRIMARY KEY AUTOINCREMENT,
    fact TEXT UNIQUE,
    created_at DATE DEFAULT (DATE('now'))
);

Run the script with:

python import_cat_facts.py

⚙️ Part 2: FastAPI Backend – main.py

Create a FastAPI app that connects to the SQLite database and exposes:

GET /catfacts

Returns all cat facts in the DB:

[
  { "id": 1, "fact": "Cats sleep 70% of their lives.", "created_at": "2024-04-02" },
  ...
]

GET /catfacts/random

Returns a random cat fact:

{ "fact": "Cats can rotate their ears 180 degrees." }

POST /catfacts

Accepts a new cat fact via form data (fact=...) and inserts it into the database:

  • Return a message if it's a duplicate or invalid

⚠️ CORS Setup

Your backend must support CORS to allow requests from your frontend:

from fastapi.middleware.cors import CORSMiddleware

app.add_middleware(
    CORSMiddleware,
    allow_origins=["*"],  # You can limit this to http://localhost:3000 if preferred
    allow_credentials=True,
    allow_methods=["*"],
    allow_headers=["*"],
)

Run the backend with:

uvicorn main:app --reload

⚛️ Part 3: React Frontend

Set up a basic React app however you like (Vite, Create React App, etc). It should:

  • Fetch and display all cat facts from GET /catfacts
  • Provide a form to submit a new fact to POST /catfacts

Styling is not required — focus on working functionality.

✅ Project Checklist

  • import_cat_facts.py fetches and stores 5 unique facts
  • SQLite DB and schema created programmatically
  • FastAPI backend with all three endpoints
  • CORS enabled on the backend
  • React frontend fetches and displays data
  • React form can submit a new fact