Build · 2h · ₹0
A full-stack fake news classifier pairing a TF-IDF + Logistic Regression pipeline with a committed 1920s broadsheet UI and a zero-cloud mock-mode toggle for ₹0 portfolio longevity.
What it does
The mechanics, data flow, and user interaction model behind The Truth Herald.
Paste any news article to receive an authenticity verdict (REAL vs. FAKE) accompanied by a confidence score and highlighted linguistic signals, rendered inside a 1920s vintage broadsheet newspaper interface featuring 3D paper unfolds, rubber-stamp verdict animations, and period typography. Under the hood: input text is preprocessed (lowercased, stripped of URLs/HTML, cleaned of stopwords), vectorised across 50,000 unigram/bigram features with TF-IDF, and scored using a class-balanced Logistic Regression model served from Cloud Storage via serverless Python functions.
Technical Highlights
- 1920s vintage newspaper aesthetic featuring 3D paper-unfold transitions, rubber-stamp verdict decals, and Playfair Display serif typography
- Dual-mode architecture: zero-cloud mock demo mode for permanent free hosting + complete Firebase serverless production path
- Confidence-scored binary text classification pipeline (TF-IDF 50k n-grams + class-balanced Logistic Regression)
- Decoupled model storage: weights loaded lazily from Google Cloud Storage into serverless Python execution memory
- Honest dataset documentation: notes ISOT source-style distribution caveats alongside benchmark accuracy figures
Why it matters
The architectural judgment, practical engineering decisions, and core problems solved.
Beyond the NLP classification mechanics, this build demonstrates an essential pattern for sustainable portfolio projects: clean dual-mode architecture. The app runs 100% client-side via a mock-mode toggle (VITE_USE_MOCK=true) requiring zero ongoing cloud infrastructure spend, while maintaining the full production pipeline (Firebase Auth, Firestore persistence, GCS model loading, and Vertex AI training) behind the same unified codebase. Visitors get instant, zero-latency interactive evaluation without the builder accumulating recurring server bills.
Educational journalism & media literacy workshops for exploring linguistic disinformation patterns
Browser extension baseline for real-time article headline and copy authenticity scoring
Demonstration reference for building zero-maintenance cloud-optional web applications with rich visual themes
Baseline classification pipeline for benchmarking transformer upgrades (DistilBERT/RoBERTa)
System architecture
End-to-end execution pipeline running across React 19, scikit-learn, Firebase Functions, Firestore, Tailwind CSS v4.
Captures raw article text and routes to either zero-cloud mock engine or live backend based on environment flag
Lowercasing, URL/HTML tag stripping, tokenization, and stopword filtering
Transforms text into 50,000-dimensional sparse feature vectors across unigrams and bigrams
Class-balanced binary probabilistic scoring generating authenticity predictions and confidence intervals
Serverless Python endpoint loading pickled model artifacts lazily from Cloud Storage with Firestore logging
The path
Step-by-step implementation guide. Verbatim code snippets, configurations, and prompts.
Building the Text Preprocessing & TF-IDF Feature Extractor
Clean article text by removing HTML entities, URLs, and punctuation before extracting 50,000 unigram/bigram features with sublinear TF scaling.
Verbatim Code / Config
def clean_text(text: str) -> str:
text = re.sub(r'https?://\S+|www\.\S+|<.*?>', '', text.lower())
return ' '.join([w for w in text.split() if w not in STOPWORDS])
vectorizer = TfidfVectorizer(max_features=50000, ngram_range=(1, 2), sublinear_tf=True)Training Class-Balanced Logistic Regression Classifier
Train Logistic Regression with balanced class weighting to handle uneven sample counts, export serialized pickle weights to Cloud Storage.
Verbatim Code / Config
model = LogisticRegression(class_weight='balanced', C=1.0, max_iter=1000)
model.fit(X_train_tfidf, y_train)
joblib.dump(model, 'model.joblib')
joblib.dump(vectorizer, 'vectorizer.joblib')Designing the 1920s Broadsheet React Interface
Craft the vintage aesthetic using Tailwind CSS v4 custom color palettes (#f4ecd8 paper sepia), CSS 3D origami unfold transforms, and animated rubber-stamp verdicts.
Verbatim Code / Config
// Paper unfold animation with CSS 3D transform
<div className='perspective-1000 bg-[#f4ecd8] border-4 border-double border-[#2b2b2b] p-8 shadow-2xl transition-transform duration-700 hover:rotate-x-2'>
<h1 className='font-serif text-5xl tracking-widest text-center border-b-2 border-black pb-4'>THE TRUTH HERALD</h1>
</div>Dual-Mode Cloud/Mock Switcher in Firebase Functions
Implement environment toggle VITE_USE_MOCK=true to serve synthetic heuristic scoring directly in the browser while supporting live GCS model loading in Firebase Functions.
Verbatim Code / Config
export async function classifyArticle(text: string) {
if (import.meta.env.VITE_USE_MOCK === 'true') {
return mockClassify(text); // Zero latency, ₹0 infrastructure spend
}
return fetch('/api/classify', { method: 'POST', body: JSON.stringify({ text }) });
}Where it broke
The failure mode, root-cause breakdown, and resolution discovered during development.
The Tell
“Model achieved 99% test accuracy on train sets but dropped significantly on newly written contemporary news articles.”
Why it failed
The ISOT dataset used for initial training had source-style leakage: fake articles had distinct capitalization quirks and specific outlet signatures that the model memorized as shortcuts rather than learning semantic fakeness.
The Fix
Standardized text preprocessing to strip source metadata, capitalized headline artifacts, and publisher tags. Documented the known dataset distribution limits explicitly in the UI and roadmap rather than presenting an artificial 99% accuracy claim.
What it cost
₹0 to build and run permanently within verified free tiers.
| Service / Tool | Cost | Free Tier Limits |
|---|---|---|
| React 19 & Vite | ₹0 | Open-source frontend hosted on GitHub Pages / Vercel Hobby |
| scikit-learn & Python | ₹0 | Open-source BSD-3-clause machine learning suite |
| Firebase Free Spark Plan | ₹0 | Free tier covers Firestore reads/writes and storage |
| Mock-Mode Client Engine | ₹0 | Zero-cloud demo mode ensures permanent ₹0 maintenance cost |
| Tailwind CSS v4 & Fonts | ₹0 | Google Fonts Playfair Display & open-source styling |
Make it yours
Three concrete variations you can build and ship using this exact foundation.
- 01
Academic Paper Citation Authenticity Checker: Analyzes bibliography formatting and DOI patterns in research papers to flag predatory journal citations.
- 02
Phishing Email Red-Flag Scanner: Scans incoming emails for urgent manipulative language, mismatched sender signatures, and dubious links.
- 03
Victorian Era Sentiment Classifier: Analyzes modern user reviews and re-expresses sentiment analysis using 19th-century prose aesthetics.
Where next
Ready to ship The Truth Herald?
Review the architecture, clone the prompt and implementation steps, and deploy your live URL for ₹0.