We've designed Divjoy to give you simple code that you can grasp simply by browsing through the codebase and reading the included code comments. If you're familiar with React then it should mostly just make sense. If you're learning React then it should align with the the learning material you're going through. It's all common React and javascript patterns. We add some extra abstractions here and there (such as a custom useAuth hook that wraps your authentication provider) when the benefits vastly outweigh the costs of a little extra abstraction. Basically, we try to provide the ideal balance between simple and powerful so that you can get up to speed quickly and get to work building your app.

Code Structure

Here is an example code structure. This will vary a little bit depending on your chosen stack, but it should give you a basic idea of how we organize things.

  • /api (server logic)
    • _db.js
    • _require-auth.js
    • stripe-create-checkout-session.js (api route)
    • etc ...
  • /public
  • /src
    • /components
      • Auth.js
      • ClientsSection.js
      • DashboardSection.js
      • etc ...
    • /pages
      • _app.js (layout that wraps pages)
      • about.js
      • auth.js
      • dashboard.js
      • etc ...
    • /util
      • analytics.js
      • auth.js
      • db.js
      • etc ...
  • .env (add all your environment vars here)
  • .gitignore
  • package.json
  • readme.md (instructions for your specific stack combo)

Any questions you have that aren't answered here? Please reach out and let us know. We'll answer your question and then improve the docs for others.