mvc/modules

[bronze tusk]

I am always confused about it haha
i have a project of Crypton to coins , fetch list of coins from the gekocoin api
and i have 3 files , manager , model , view

and im confused what i need to present in each file..

[safe hare]

Is it you who chose the of the files?

About MVC, it's an architectural pattern that divides your software into three main parts: Model, View, and Controller.

• The Model represents the application’s data and business logic. It handles data storage, validation, and rules.
• The View is responsible for displaying the data to the user. It shows information from the Model but contains no business logic.
• The Controller acts as the intermediary between the Model and the View. It processes user input, updates the Model, and determines which View to display.

(I'll show you a diagram on how they communicate with each other).

Note that this doesn't mean all software are divided in three modules, you can have multiple views, models and controllers.

In your case you have a file called manager which is not generally part of MVC (but doesn't mean it cannot exist your software)

[bronze tusk]

my html talk only with the view , and the view import from the manager

[safe hare]

The HTML doesn't talk with annyone. It should be your view. What does the crypto-view do exactly?

It seems like you have the crypto-manager and crypto-view doing the job of a controller. In a web app, the view is the HTML. It is rendered by the controller (who also handle user events) and the model handles the data.

If you could share more info (like the code in each, their purpose, the goals you have, etc) it would help

Also, did you read what I sent about MVC? Do you understand it?

[bronze tusk]

yes , so in my case , the model is the manager , the view is the js i linked on the html file and the controller in the crypto.model , i will show you rn ofc

i just started haha

Crypto Manager:

class CryptoManager {
  cryptoList = [];

  async fetchCryptoData() {
    const response = await fetch('https://api.coingecko.com/api/v3/coins/list');
    const data = await response.json();
    this.cryptoList = data;
    const oneHundred = this.cryptoList.slice(0, 100);
    console.log(oneHundred);
  }
}

export const cryptoManager = new CryptoManager();

Crypto View:

import { cryptoManager } from './crypto-manager.js';

cryptoManager.fetchCryptoData();

Crypto.Model:

 class Crypto {
  constructor(id, symbol, name) {
    this.id = id;
    this.symbol = symbol;
    this.name = name;
  }
}

[safe hare]

Yeah so your models are: crypto.model.js and crypto-manager.js

Your crypto-view.js seem to be acting as your controller.

Which is not correct.

Separating the code that fetch the data and the datamodel isn't a bad idea but usually you would create a service for that. This would make both of the part of your models (which is fine).

[bronze tusk]

yea the coin manager act as a service

[safe hare]

You should call it like that and not manager, manager has other meaning in programming

[bronze tusk]

that's how he taought us tbh