Now the next step is that we should be aware
of browser limitations, and that we might want
to improve our code so that it works in more browsers.
That is something you want to check for
because not all your website visitors will use
the same browser and browser version as you do,
and not all browsers support all the features,
though the vast majority of features are supported
by all important browsers.
So it's not a huge issue these days anymore,
but something to be aware of.
And what's really important here is
that with that, I'm talking about browser-side code only.
So CSS and browser-side JavaScript,
because HTML is pretty standardized.
I'm talking about these features
because what happens on the backend is not interesting
to the browser at all.
Your node JS code is not interesting to the browser at all,
there, you just need a hosting provider
that supports the node JS version you used for development,
but the browsers don't care.
Now, here in these examples,
I don't have any browser-side JavaScript code,
just some browser-side CSS code,
but even here it is, for example,
worth pointing out that I'm using flexbox
Now flexbox, like all the CSS features we taught you
in this course, is very well supported.
Actually, all the features in general,
including JavaScript features, are very well supported.
Still, You might want to look up
what the browser is support for a certain feature is
if you're in doubt.
And a great page that can help you
with that is caniuse.com.
Here, you can simply enter something like flexbox,
and it will give you the CSS flexbox information page,
where you see the browser support for this feature,
and you see different browsers and different versions here.
And you also, that's very convenient,
get the market share off different browser versions.
So here you have this global number,
which is the usage of that specific version of that browser.
And you see it differs between
browsers and browser versions.
And you've got an overall summed up
support level here in the top right corner.
So you, for example, see that flexbox
has amazing support and there is nothing
you have to worry about there in the end.
You can, by the way, also always just directly
search for, can I use, and then whatever
you want to check, for example, CSS grid.
And can I use should be one of the first results then,
and you'll learn what the grid support is
As you can see here, it's also very good.
Now, as I mentioned,
the features we taught you in his course have amazing
support and you don't need to check every single CSS or
JavaScript feature you are using.
Typically, you know when you are using an
agile level feature which is relatively new
and that's when you might want to double-check
the feature support.
So for example, if I search for a CSS variables,
and with that I mean the custom properties here,
that is something where we could be unsure about,
but we see even that has great support.
Though it is worth pointing out,
that for example Internet Explorer,
no matter which version has no support for it.
Now thankfully Internet Explorer is finally dying,
it was alive way too long in various companies.
And yes, some companies are still using it,
but it's finally dying.
And therefore typically you don't need to worry about
supporting Internet Explorer.
The Edge browser, which is now a standard browser
on Windows has support for a custom properties for example.
If for some reason, you know that some key visitors
of your website will be using Internet Explorer though,
you, for example, would not be able to use
CSS variables and you would have to
write CSS code that does not rely on that feature.
Though I will also say that there are tools out there
that can automatically transform your code
to replace a certain feature you use in your code
with cross-browser compatible code behind the scenes,
and it's then the transformed file which you would deploy,
but that's beyond the scope of this course
and a bit more advanced, and as mentioned
for most features, it's also not needed.
Another great resource to use is MDN.
For example if you're unsure about the fetch function,
which be used for sending HTTP requests.
Then if you search for fetch MDN,
you will not just get a detailed explanation examples,
but you also find a browser support table down there.
And here we, for example, also see that
Internet Explorer also doesn't support fetch.
Other browsers do though.
We could have also used can I use here by the way.
So that is something you want to check for it because not
all your website visitors will use the same browser and
browser version as you do.
And not all browsers support all the features,
though the vast majority of features
are supported by all important browsers.
So it's not a huge issue these days anymore,
but something to be aware of.