1. What We're Building

What We’re Building

Read Documentation

Welcome! In this course, we’ll be building Newsy, a full-stack app that will teach you React by building Hacker News. We’ll be building a main news feed, a link page for upvoting and commenting, a trending page that sorts links by upvotes, a search page for searching links by text, and a comprehensive authentication system to gate access. 

Newsy is an app that works on web, iOS, Android, Mac, and Windows. 

We’ll be shipping all of these apps with React and with one shared code base by using two tools:

The first is Ionic, a UI toolkit for building performant, high-quality web, mobile and desktop apps.

And the second is Firebase, a serverless framework that will handle our server-side infrastructure and deployments.

This means we can focus just on React while building and deploying a cross-platform experience working on web, mobile, and desktop 

Hacker News

Buy nowLearn more

Welcome

  • 1. What We're Building23

Tooling

  • 2. Installing Hyper5
  • 3. Installing Node2
  • 4. Installing VSCode3
  • 5. Installing Ionic5
  • 6. Installing Firebase2
  • 7. Installing GitHub1

Architecture

  • 8. Project Start15
  • 9. Assets and Theme2
  • 10. Routing and Tabs30
  • 11. Header Components15
  • 12. Firebase Setup1

Authentication

  • 13. Firebase Authentication2
  • 14. Authentication Pages5
  • 15. useForm Hook and Validators21
  • 16. useAuth and UserContext
  • 17. Profile Page5
  • 18. Edit Profile Page and Validation3

Links

  • 19. Submit Links with Firebase Firestore4
  • 20. Link Lists1
  • 21. Link Item
  • 22. Link Pages5

Upvotes and Comments

  • 23. Link Upvotes5
  • 24. Link Comments3

Search

  • 25. Search Page

Deployment

  • 26. Web App Deployment with Firebase Hosting3
  • 27. iOS Deployment with Capacitor
  • 28. Android Deployment with Capacitor1
  • 29. Mac and Windows Deployment with Electron and Capacitor14