Dynamically load your code at the component level.
Have you ever added a dependency to your Vue project and suddenly realized you have blown your budget on bundle size? I sure have. When you test your project in Lighthouse, does it demand you reduce the amount of unused JavaScript? Of course, it is up to you to figure out how to do that, and it is not at all obvious. Many tutorials suggest dynamically loading your routes, and that can help, but it can also slow your app down.
If you want to build vanilla JavaScript apps, JSX would be a useful tool. Vite makes it easy.
It’s been possible to use JSX without React for some time, but the tooling setup was awkward. This article from 2020 shows a way to implement it yourself, but since then the options have blossomed. The powerful tool Vite means we can entirely avoid the complexities of Webpack and Babel.
JSX offers many possibilities for a vanilla JavaScript developer, because it is such a convenient way to represent HTML in JavaScript, making it possible to easily return DOM elements directly from JavaScript…
We all make mistakes. Some simple safeguards can make a big difference.
TLDR: Install git-check-stop as a development resource in your project so you never make an embarrassing build or deploy mistake again.
I’m sure, like me, you have never typed
npm run deploy-livewhen what you meant was
npm run deploy-stagingI know. Who makes a mistake like that, eh? Not us.
Well, just in case someone else ever comes over and starts typing at our computer, let’s put some safeguards in place.
If you use git, there are plenty of node packages out there that can help us…
Unless you manually hack together your mobile site out of bare HTML and show no pictures.
When I started out, I was going to write an interesting article about how you could get a website to pass the mobile Core Web Vitals assessment that Google is going to roll out as a major driver of SEO ranking in the coming months:
Scalable Vector Graphics are a unique feature of the web.
If you are a graphic designer or web developer, you already know how useful SVGs can be. They are small, easy to make, and above all they allow you to create images for web pages that look perfect at every possible size. But they can also be styled with css, and offer multiple ways to create and control animation in your page. Here I show you some very simple ideas to get started with editing and animating them.
When I first found out about the SVG format, I was rather confused by the fact that you can show them in…
If you’re using IIS 10, you’ll need to pass those security audits. Here are some typical things that aren’t configured right out of the box, and how to fix them.
You will generally be in good shape using IIS 10 to securely host websites, but there are some changes you must make to pass a security audit.
Although many potential security flaws may lurk in the applications you host (and you’ll need to attend to those for sure), the more predictable ones can be dealt with at the server level. You’ll want to be certain your web sites can survive a security audit before your client asks for one, so here are the typical extra configurations you’ll need to add so it passes with flying colors.
This isn’t an exhaustive…
It’s harder than you think. But it’s not that hard.
When you first take a look at how to do this, especially if your origin is an s3 bucket as we’ll be using here, it seems like it’s going to be really simple. All you have to do is take a look at the User-Agent header as it comes in, and then choose a different source for your files, right?
But wait.
By default, Cloudfront doesn’t pass the standard headers through to an Origin Request function. You can only get the User-Agent in a Viewer Request function, and a Viewer Request Lambda function cannot select the Origin.
And, given how…
IIS is easy to use with Node, Express and Vue. Yes, you heard that right.
Do you have websites that you would like to add a full or partial VueJS front-end to, but need to communicate with a .NET api? Do you have an Express server you would like to easily integrate with an existing .NET site? Or do you just want to use an excellent and powerful Windows web server to host all of your Node development? I thought so. Here’s how you can have it all.
This also works with many other varieries of server technology. It will also work with React or Angular, and any kind of http server.
David Mold
Lifelong developer
