The project is a web application that allows kids to learn and practice programming using visual blocks with a user-friendly editor

PROJECT PHILOSOPHY • ER DIAGRAM • SYSTEM ARCHITECTURE • TECH STACK • API DOCS • HOW TO RUN

Programming is a skill that is becoming more and more important in our society. However, it is not easy to learn and practice programming. This project aims to make programming more accessible to kids by providing a visual block-based editor that allows them to learn and practice programming in a fun and engaging way.

The project main goal is to empower young kids with programming knowledge and skills. The project is designed to be fun, engaging, and easy to use. The project is also designed to be a tool for teachers to help them teach programming to kids.

ER Diagram Non transparent <> Download 4k here
ER Diagram Transparent <> Download 4k here

System Architecture <> Download SVG here

Here's a brief high-level overview of the tech stack the NinjaCo app uses:

• This project uses the NextJs library. Nextjs is a React framework that allows you to build server-side rendered React apps. It is a framework that allows you to build React apps with a lot of features out of the box, such as routing, server-side rendering, and more.

• For styling, the app uses Tailwind CSS, a utility-first CSS framework for rapidly building custom user interfaces.

• For authentication, the app uses NextAuth, an open source authentication library for Next.js.

• For testing, the app uses Jest, a JavaScript testing framework. Jest is a complete and easy to set-up JavaScript testing solution. It works with projects using: Babel, TypeScript, Node, React, Angular, Vue and more!

• For linting, the app uses ESLint, a pluggable and configurable linter tool for identifying and reporting on patterns in JavaScript. ESLint is built into most text editors and you can run ESLint as part of your continuous integration pipeline.

• For persistent storage, the app uses MongoDB, a general purpose, document-based, distributed database built for modern application developers and for the cloud era.

• For backend API, the app uses NestJS, a progressive Node.js framework for building efficient, reliable and scalable server-side applications.

• For image storage, the app uses Minio, an open source object storage server compatible with Amazon S3 APIs. Minio is a high performance distributed object storage server, designed for large-scale private cloud infrastructure.

• For code formatting, the app uses Prettier, an opinionated code formatter. Prettier is an opinionated code formatter with support for JavaScript, TypeScript, CSS, JSON, GraphQL, Markdown, and more. It removes all original styling and ensures that all outputted code conforms to a consistent style.

---

API Documentation Online

Link To Documentation

To get a local copy up and running follow these simple example steps.

Prerequisites 📝

• Node.js
• Docker

Setup 🚀

1. Clone the repository 🎉

git clone https://github.com/NinnjaCo/ninjaco-nextjs.git

2. Install dependencies ✨

npm install

3. Copy the .env.example file and rename it to .env

cp .env.example .env

Edit the .env file and add your own values.

4. Run the server

You should have docker and docker-compose installed. Use docker-compose to run the app.

docker-compose up

This will run:

• MongoDB

• MongoDB Express

• NestJs App

• Minio

• MailDev