Creating first real website with big database

ersi · 2019-04-16T12:01:11.843Z

Hi Im trying to create first real website with bigger database with meteor, I have watched tutorials and how to work with meteor. Can you give me some tips? Site will be simple based on one select with multiple values and one search bar. Based on values from theese 2 inputs I want to display data from database. In database I want to store just strings and every record will have like 1-10 photos. There will be more than 500 records in database. Thank you for every tip.

znewsham · 2019-04-16T15:28:07.518Z

500 records isn’t really a “big” database, so I’d suggest you just follow some tutorials online for setting up a mongo replicaset - depending on how heavily your database will be queried and how quickly your database is going to grow, you can likely go with the cheapest possible hardware. We use a replicaset of AWS EC2 t2.large and have about 70 million records (across many collections) we find that 99% of the time our CPU usage is below 10%, we really just need the large for the memory, otherwise we could go small.

Regarding meteor itself, again - there are many tutorials for configuring it for production, but it’s pretty simple. If you’ve got some specific questions, I’m happy to try to answer them, But otherwise, your best bet is to work through a tutorial.

ersi · 2019-04-17T16:03:50.475Z

Wow, Im really lost. I have watched and red so many tutorials

1st:
Im trying to create db with multiple companies. I have created new directory called lib, then inside that directory I have created companies.js to create db with records. This is what I have
lib/companies.js

companiesList = new Mongo.Collection('companies');

var arrayOfCompanies = [
	{
		name: "CS s.r.o", 
		category: "stavebna firma",
		region: "Trnavsky kraj",
		adress: "Strojárenská 5487, 91702 Trnava",
		contact: "+421332933290",
		email: "cstt@cstt.sk",
		web: "http://www.cstt.sk",
		info: "Dopravné stavby - cesty, komunikácie, chodníky, parkoviská, spevnené plochy, športoviská, sadové úpravy.Pozemné stavby – rodinné domy, bytové domy",
		photos: "there should be photos.."
	},

	{
		name: "HROMEX, s.r.o.", 
		category: "stavebna firma",
		region: "Trnavsky kraj",
		adress: "Bulharská 2475/44, 91701 Trnava - Juh",
		contact: " +421335533733",
		email: "hromex@hromex.sk",
		web: "http://www.hromex.sk",
		info: "Stavebno–obchodná spoločnosť Hromex, s.r.o., vznikla v roku 1999 ako nová spoločnosť. Ako napovedá názov, podstatnou náplňou činnosti spoločnosti je stavebná činnosť",
		photos: "there should be photos.."
	}
]

companiesList.insert(array);

There will be more than 500 of theese companies.

2nd:
On main page I need some simple inputs one for category second for region based on theese inputs I want to show data from my collection, am I doing it right?

this is my main.html on client side

<head>
  <title>project</title>
</head>

<body>
  <div class="container">
    <h1>project-companies</h1>
    <select name="region">
      <option value="Bratislavsky kraj">Bratislavsky kraj</option>
      <option value="Trnavsky kraj">Trnavsky kraj</option>
      <option value="Trenciansky kraj">Trenciansky kraj</option>
      <option value="Nitriansky kraj">Nitriansky kraj</option>
      <option value="Zilinsky kraj">Zilinsky kraj</option>
      <option value="Banskobystricky kraj">Banskobystricky kraj</option>
      <option value="Presovsky kraj">Presovsky kraj</option>
      <option value="Kosicky kraj">Kosicky kraj</option>
    </select>
    <select name="category">
      <option value="stavebna firma">Stavebne firmy</option>
      <option value="uctovnictvo">uctovnictvo</option>
      <option value="pneuservis">pneuservis</option>
      <option value="taxi">taxi sluzby</option>
      <option value="zahradnictvo">zahradnictvo</option>
      <option value="restauracie">restauracie</option>
      <option value="pravnik">pravnik</option>
      
    </select>
  </div>
</body>

Thank you for every advice, I have created many websites but it was just for school projects using javascript, php and some libraries.

robfallows · 2019-04-17T16:34:28.878Z

ersi:

This is what I have
lib/companies.js

You can certainly pre-load all your companies like this (except see below), but every time you re-run that code you will add all the companies again. That’s because without an _id for each document, a new document with a new _id will get created each time. It’s better to put all your pre-loading stuff outside of your main application.

ersi:

companiesList.insert(array);

I don’t think you want to do this. That will attempt to insert a single document, being an array of all your companies. That’s potentially huge and doesn’t make it easy to get any one company’s information. What you probably want is:

arrayOfCompanies.forEach( company => {
   companiesList.insert(company);
});

Which will give you one document with a unique _id for each company.

Once you have a list of companies, categories or regions in Mongo, you can then use Meteor’s pub/sub, for example, to automatically populate your dropdown lists and have them dynamically change as companies, categories or regions are added, changed or removed. Data which doesn’t change very often and affects the UI is a surprisingly good way to use pub/sub.

znewsham · 2019-04-17T17:15:59.874Z

Apart from @robfallows comments, that looks like a reasonable setup - however, the HTML and the “setup” code are probably the least interesting/complex pieces - the important part will be publishing the data, and subscribing to it - which if I understand your goal correctly will likely require a reactive variable (or two, or a reactive dictionary) in your client side JS to track which category and region are selected and subscribe accordingly.

As a side note, I’d suggest you put your HTML into a template and reference that from your body - this encourages good separation of code, and avoids the situation where you could have a single behemoth file.

One small thing I’d say about your companies insertion is this: A good(ish) way of doing this is to check if you have any companies before you insert. This ensures you run the inserts only once per environment (development, staging and production).

Meteor.startup(() => {
   if (companiesList.find().count() === 0) { 
      arrayOfCompanies.forEach( company => {
         companiesList.insert(company);
      });
   }
});

ersi · 2019-04-17T21:44:59.230Z

So, I have changed the way Im creating database like you told me
Im using(in lib/companies.js):

Meteor.startup(() => {
   if (companiesList.find().count() === 0) { 
      arrayOfCompanies.forEach( company => {
         companiesList.insert(company);
      });
   }
});

Than I have moved selects to templates(in client/main.html):

Calling in body just 
{{> regions}}
{{> categories}}

<template name="regions">
    <select name="region">
      <option value="Bratislavsky kraj">Bratislavsky kraj</option>
      <option value="Trnavsky kraj">Trnavsky kraj</option>
      <option value="Trenciansky kraj">Trenciansky kraj</option>
      <option value="Nitriansky kraj">Nitriansky kraj</option>
      <option value="Zilinsky kraj">Zilinsky kraj</option>
      <option value="Banskobystricky kraj">Banskobystricky kraj</option>
      <option value="Presovsky kraj">Presovsky kraj</option>
      <option value="Kosicky kraj">Kosicky kraj</option>
    </select>
</template>

<template name="categories">
    <select name="category">
      <option value="stavebna firma">Stavebne firmy</option>
      <option value="uctovnictvo">uctovnictvo</option>
      <option value="pneuservis">pneuservis</option>
      <option value="taxi">taxi sluzby</option>
      <option value="zahradnictvo">zahradnictvo</option>
      <option value="restauracie">restauracie</option>
      <option value="pravnik">pravnik</option>
    </select>
</template>

Than I was trying to implement that pub/sub, i have looked some tutorials and came out with something like this, but it is not working I think I have something wrong in return but I did not find what
This is my script(at the and of body in script tags in client/main.html):

'region': {
      label: 'Kraj',
      type: String,
      autoform: {
        firstOption: 'Vyber kraj',
        options: function() {
          return companiesList.find({},{sort: {region: 1}}).map(function(region){return {label: company.region};});
        }
      }
    },
    'category': {
      label: 'Firma',
      type: String,
      autoform: {
        firstOption: 'Vyber firmu/sluzbu',
        options: function() {
          var formId = AutoForm.getFormId();
          var region = AutoForm.getFieldValue('region', formId);
          return companiesList.find({category: region},{sort: {category: 1}}).map(function(category){return {label: company.category};});
        }
      }
    }

znewsham · 2019-04-18T00:23:08.258Z

That is very wrong. You should go through the meteor Todo tutorial or the meteor guide. You need to publish data from the server. Also, don’t put anything in script tags. Use Js files.