Skip to content

πŸ“š β€’ A simple, challenge-driven project for recording text-based notes utilizing the NEVM Stack.

Notifications You must be signed in to change notification settings

ernestoyoofi/notes-app.nevmstack

Folders and files

NameName
Last commit message
Last commit date

Latest commit

Β 

History

3 Commits
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 

Repository files navigation

Notes App With NEVM Stack

A simple, challenge-driven project for recording text-based notes utilizing the NEVM Stack. This application serves as a practical exercise to explore the capabilities of Vue.js and enhance Node.js backend skills.

πŸ› οΈ Technologies Used

This project is built using the NEVM Stack (Node, Express.js, Vue.js and Mongodb) components, along with modern web technologies

Nodejs Express Vue.js Mongodb Tailwind CSS Vite

πŸš€ Getting Started

Follow these steps to get the application up and running on your local machine using Docker.

Prerequisites

Ensure you have the following installed:

  • Docker
  • Docker Compose

Installation

  1. Clone the repository:

    git clone https://github.com/ernestoyoofi/notes-app.nevmstack.git
    cd notes-app.nevmstack
  2. Build the Docker image:

    This command tags the built image for easy management.

    docker build -t ernestoyoofi/notes-app.nevmstack .

    Or using image on Docker Hub

    docker pull ernestoyoofi/notes-app.nevmstack:latest
    
  3. Configure Environment:

    Open the docker-compose.yml file and adjust any necessary environment variables for the NEVM connection (e.g., API keys, port mappings, etc.).

    nano docker-compose.yml 
    # Or your preferred text editor
    version: "3.8"
    services:
      database:
        image: mongodb/mongodb-community-server:8.2-ubi9
        container_name: notes-app-nevmstack-mongodb
        restart: always
        environment:
          - "MONGODB_INITDB_ROOT_USERNAME=notes-appnevimstack" # PLEASE CHANGE
          - "MONGODB_INITDB_ROOT_PASSWORD=notes-appnevimstack" # PLEASE CHANGE
        volumes:
          - notes-app-nevmstack-mongodb:/data/db
        networks:
          - notes-app-nevmstack
    
      app:
        image: ernestoyoofi/notes-app.nevmstack:latest
        restart: always
        ports:
          # Exposes Port
          - 3002:80
        environment:
          # Database (FOLLOWING STACK)
          - "MONGODB_URI=mongodb://notes-appnevimstack:notes-appnevimstack@database:27017/nevmstack-notes-app?authSource=admin" # PLEASE CHANGE
          # Server (REQUIRE)
          - "JSONWEBTOKEN_SECRET_KEY=TOKENTOKENTOKEN!!!" # PLEASE CHANGE
          # Google OAuth (REQUIRED)
          - "GOOGLE_CLIENT_ID=XXXXXXXX-XXXXXXX.apps.googleusercontent.com" # PLEASE CHANGE
          - "GOOGLE_CLIENT_SECRET=GOCS-XXXXXXXX" # PLEASE CHANGE
          - "GOOGLE_REDIRECT=http://localhost:3002/api/v1/oauth/callback" # > URL Proxy Backend # PLEASE CHANGE
        networks:
          - notes-app-nevmstack
    
    volumes:
      notes-app-nevmstack-mongodb:
    
    networks:
      notes-app-nevmstack:
  4. Run the application with Docker Compose:

    The -d flag runs the containers in detached (background) mode.

    docker compose up -d
  5. Access the application:

    Open your web browser and navigate to the specified URL (usually http://localhost:[PORT], check your docker-compose.yml for the port).

🎯 Project Goals

This project was developed primarily as a personal challenge and a learning opportunity to:

  • Deeply understand and integrate with the NEVM Stack.
  • Improve proficiency in building single-page applications with Vue.js.
  • Refine backend development skills using Node.js/Express.

πŸ“„ License

No license on this project, you can use it freely.

About

πŸ“š β€’ A simple, challenge-driven project for recording text-based notes utilizing the NEVM Stack.

Topics

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published