Fish out of water in server side questions ...
Hi!
I was just offered a web dev job by a friend, and since one can't sit and to tutorials for the reste of ones life I said "Sure! I'll fix this for you!" ... and now I'm shit scared, haha!
So I have a a few questions, and I don't expect you guys to solve them all, but I need to know how to frame the problems so I can ask for proper help from developers I know can fix this.
The page is simple enough, but it has two major dynamics.
1. It must have a Google maps API, with the possibility to auto locate your position and add specific locations in the map: Example - I'm at location x, closest location y is this one.
2. There won't be a shop with possibilities to buy anything through the page, but the page must show live product inventory updates.
Now, my question is:
1. Where would be the best place to host such a page (I live in Norway), without it being mega expensive but also at some point scalable if one would wanna add a shop into the page? Is it feasable to do it from GitHub Pages, or do I have to go somewhere else?
2. I feel like the only Javascript aren't massive operations. Could I get away with just vanilla JS and go with that, or should I go all in and use a framework for this project? I have no experience with JS, and there is money to hire backend JS developers, but my question is do I have to make it bigger then it is?
In the spirit of Kevins (don't make it bigger then it has to, and HTML and CSS is mega powerful, don't do everything in JS if it can be done in CSS), I think this page basically is a static side with to specific dynamics in it. That's how I want to think about it at this stage, and then when things scale up (with a shop etc.) then we deal with that then. I'm a bit wary of making it bigger then it is at the moment. Better to build out the basics, and then scale up if needed. It really isn't a massive app project.
13 Replies
It must have a Google maps API, with the possibility to auto locate your position and add specific locations in the map: Example - I'm at location x, closest location y is this one.This is a pretty big ask, especially from someone with no experience. Google Maps API (and Google APIs in general) are pretty rough to work with from what I hear. Also, the Google Maps API can get very expensive if you don't know what you're doing. It might be worth it to find alternates to Google Maps. https://mapbox.com is a cheaper alternative, for example.
There won't be a shop with possibilities to buy anything through the page, but the page must show live product inventory updates.This is a basic use case for a database of some kind. Nothing out of the ordinary here. The question is what database? SQL is the industry standard, but is also ancient. Like, older than I am. MongoDB uses JSON-like document stores so is easier to understand for those used to JSON. Redis is a "simple" key/value store where everything is a string. Super easy to use but is in-memory so has a few caveats. Graph databases are great for this kind of thing if you want to include product suggestions (as that's what graphs do best: connect the dots!)
Where would be the best place to host such a page (I live in Norway), without it being mega expensive but also at some point scalable if one would wanna add a shop into the page? Is it feasable to do it from GitHub Pages, or do I have to go somewhere else?No, GitHub pages is not an option. While the front is is mostly static the back end is going to be where the majority of work is done and GH Pages is front-end, static only. I personally use https://webdock.io for my hosting needs. It's close to you and is a carbon neutral company, meaning it's good for the environment (which a lot of other hosts don't care about).
I feel like the only Javascript aren't massive operations. Could I get away with just vanilla JS and go with that, or should I go all in and use a framework for this project? I have no experience with JS, and there is money to hire backend JS developers, but my question is do I have to make it bigger then it is?If you have no experience with JS you need to learn that first, starting with a framework is a horrible (but popular) idea. Learning React, for example, teaches you React and not JavaScript. Learn JS first, and only move on to a framework if you need what it offers. React, for example, was designed for Facebook to solve their über-scale issues. If you don't have the DAU that FB has you don't need React.
In the spirit of Kevins (don't make it bigger then it has to, and HTML and CSS is mega powerful, don't do everything in JS if it can be done in CSS), I think this page basically is a static side with to specific dynamics in it.While true, the front-end is not a lot it's the back-end you have to worry about. It has to interact with a map API. It has to cache the maps to not drive up your API costs. It has to communicate with your DB to display the stores nearby as well as the inventory. It might have to handle authorization/authentication, depending on what else the site should do. The back-end, not the front-end, is where the complexity lies. Which is true for all websites/apps.
So ...
Separation of concerns here then:
1. The maps task isn't a server issue then, it is more a technical JS, API and set up issue. It doesn't really affect where the page should be shosted, etc. It isn't really a framework issue either, because it can be done with some vanilla JS (e.g. https://developers.google.com/maps/documentation/javascript/adding-a-google-map), but just has to be done in the most efficient way. Summarized: The maos issue can be fixed with JS and is absolutelly doable if I hog down, read documentation and practice.
2. The live inventory issue is a server communications issue between back-end and front-ensd, but can still be done with vanilla JS? Am I right to conclude with that? So this is something I migth wanna pay someone who knows about these things for ... Deciding where to host the page will impact this solution, too?
3. The whole project can be done in vanilla HTML, CSS, JS, and is actually feasable since it is not a massive app like THE FACEBOOK! 😅
The maps task is so a server issue, not a front-end issue. Keep in mind that all map APIs cost money and you need to provide your API key to access it. If you don't do that in your server you're revealing your (monetarily costly) API key to the world to use. Don't do that. Same for the database connection. You never expose DB credentials to the front-end.
The whole project can be done in vanilla HTML, CSS, JS, and is actually feasable since it is not a massive app like THE FACEBOOK!While it's not a FB-level app it's still more massive an undertaking then you seem to realize 90% of what you need to do has to be done on the server for security reasons. You don't ever expose API keys or DB credentials to the user. You always sanitize user input before even touching the DB. You want to cache the results of the map API calls to reduce the cost of said API The only thing that is front-end is the UI. And the map interface is part of that UI, but the data should all come from your server
Yes! I was being unclear there ... I absolutelly know that all the gritty stuff of the map is back-end, totally. What I meant about the map was that the interface part of it is something that can be done with nicely done Kevin CSS, and doesn't have to be made with a framework etc.
Nothing ever needs to be done with a framework…even though framework authors try to convince you otherwise. All front-end frameworks are nothing more than abstractions using vanilla JS. So if it can be done with a framework by definition it can be done without
Indeed!
Don't worry, there will be money to pay for people who knows about the back-end part. This is just really for me to know what to ask for.
... daunting!
Yes, yes it is. And honestly it sounds more like you're the digital manger more than a developer :p
My issue with the web dev projects I've been part of is that they have build things way more complex then it has had to be, and then you end up with things that needs to be fixed, but where the price is either crazy high, or the timeline makes no sense.
For example, we made a new website with different page types (articles, news, performances, etc.) and the h2 of the news pages where smaller than the paragraphs. So we asked for them to fix it (to how the design showed), and they said that would take three weeks and cost $5000.
That infuriated me, and made no sense whatsoever!
I'll do the HTML and CSS, based on a design they are getting, but all of this stuff we're talking about here is for my back-end friend. 😄
seems like you're pretty clueless to anything server side
but beck made it seem waaaaay more complicated that it needed to be
first, the whole database thing: there's really only 1 maybe 2 options, I'd recommend going SQL (no, it doesn't matter that it's ancient, in fact it is a pro) but mongo is document based so it's pretty similar to a JSON or a javascript object, which should make it easier to use
the google maps API: no it is not a server side issue, you do not need to hide the API key for google maps, in fact, you can't hide it! You are given a <script> tag to include in your site where the key is visible, but it's ok because google links that key to your domain and your domain only (this is not normal and most api keys should be hidden)
[this was last time I used the google maps api which was long ago, maybe they changed it by now, always read the docs]
I'm a tad confused as to what your level of knowledge really is
in practice, the whole site can be static (minus the backend part ofc) which makes it pretty cheap to host, you'd only need an API to handle the updating of product stock
Absolutelly that's why I'm asking, and like I said in the beginning, the questions here are so I can formulate the issue in the most precise way to my back-end guy.
This is what I thought too, and what I've seen done with similar projects that I've been part of.
got it... this sentence just made me feel like you wanted to take the jump lol
and since one can't sit and to tutorials for the reste of ones life I said "Sure! I'll fix this for you!"
Hehe! That's the sales pitch you know. 😉
I will follow Becks advice on mapbox, since they work with Strava, and this project is for die hard running, skiing and biking people in Norway. So I will try and get the map interface up and running by myself, I think that is doable.
Customer project manager for web devs and have made static pages myself.
interesting