Posted on

Create a Full-Stack App Using Nuxt.js, NestJS, and DataStax Astra DB (With a Little Help From GitHub Copilot)

Building a full-stack application can be daunting because you have to not only think about how the frontend will display the data but where the data will come from and where it’s stored. However, it’s not as hard as you might think to get the basics of a full-stack application up and running.

If you want to create a full-stack application, complete with dynamic data retrieved from a cloud database by an API, then watch the tutorial below, created by Eddie Jaoude. In his tutorial, Eddie shows you how to do it in less than an hour using Nuxt.js with VuetifyJS for the frontend, NestJS to create RESTful APIs, and DataStax’s Astra DB for the cloud database service. Also, you’ll use GitHub Copilot as your AI-powered pair programmer.

Posted on

Use Socket.IO With Nuxt.js/Vue.js

For one of my recent Nuxt.js projects, I had to use Socket.IO to send the data from the server to the users in real-time without reloading the whole page. Initially, I was using Vue.js, but then the client insisted on implementing Nuxt.js for the server-side rendering purpose.

First, I used Axios as a middleware to send and receive HTTP requests. Axios is a great library to send and receive data without loading the whole page. It works great with Vue.js and Node.js. But the problem with Axios is that it only sends the response once with res.send or res.end method. If you try to send two or more times with these methods, then the app crashes.

Posted on

Vue PWA: A Progressive Web Application Development With Nuxt

Did you know that 31% of all e-commerce sales come from mobile devices? And this number has not stopped increasing since 2010.

As a web developer with an e-commerce store or working for an e-commerce owner, you should probably try to make the shopping experience for your (or client) mobile users optimal.

Posted on

Develop a Scraper With Node.js, Socket.IO, and Vue.js/Nuxt.js

The incredible amount of data available publicly on the internet for any industry can be useful for market research. You can use this data in machine learning/big data to train your model with tens of thousands of entries.

Here, in this article, I’m going to discuss the development of a web scraper with Node.js, Cheerio.js, and send back-end data to Vue.js in the front-end. Along with that, I’m going to use a simple crawler Node.js package.

Posted on

Automating NuxtJS Deployment to Heroku with CircleCI

Manually deploying a NuxtJS project is pretty easy when teams are small. However, as projects and teams grow they usually turn to CI/CD in their DevOps to automate their testing and deployment. This is when deployments—and the setup of deployments—can get complicated.

In this article, we’ll look at how to easily set up an automated CI/CD system for a NuxtJS project using Heroku and CircleCI. We’ll walk through all the details from setting up your GitHub repository to automating your tests to pushing your code changes. Then we’ll look at some suggested next steps.