Mark Mara

Mark Mara


A Genuine Review of the Framework A Year With Nuxt.js

For more than a year, I’ve been working with Nuxt.js on a daily basis.
In this review, I’ll try to summarize all of the ups and downs of working with this framework. Hopefully, this article may persuade you to try Nuxt on your new project while being aware of some caveats along the way.


  • I’ve had a year with working in Nuxt on a daily basis
  • Nuxt is very convenient and amazing for production
  • Nuxt is extendable and has lots of features and is driven by a vast and talented community
  • Nuxt does have some caveats, which I’ve built some workarounds for


  • Performant
  • Structure
  • Community
  • Documentation (guides for testing, guides for deploying)
  • Modules (i18n, sitemap, SVG, Apollo, Axios, PWA, Sentry, GA, GTM)


  • Shared-state problem (node problem)
  • is-https and Heroku (i18n multidomains, sitemap)
  • this everywhere
  • Weak rx.js support

One remark before I start: I don’t know if it was there intention, but I just love how the Nuxt logo is a mountain — like you’re behind a reliable wall.

This is image title


First of all, I want to give a small introduction to the project.

A year ago, in October 2018, my friend rami alsalman (Ph.D. in machine learning) approached me and shared the pain of using job websites nowadays (i.e., you’re trying to find the software for back-end engineer PHP, and you get a list of offers, with Python, C#,, and so on).

All in all, relevancy is poor sometimes — the recognition of required programming skills and soft skills is a problem all of its own.

The idea was to build a search system using machine-learning algorithms that will recognize any job-offer description text, any search text, and the applicant’s CV, so we could directly show the jobs that best match the CV.

That is how we came up with idea of I was responsible for the web application and became CTO of the startup, and rami alsalman became a CEO and machine-learning search-engine engineer.

This is image title

Why Nuxt?

First of all, I wanted to start a project with a long-term framework that would help us start fast and be able to extend into the future.

Another main point was to have SSR because we wanted to have sustainable SEO as a main traffic channel. Having PHP on the back end for SSR would lead to duplicating all the templates and doublethe work, which we couldn’t afford because the dev team is just me.

I started to investigate JavaScript SSR solutions, and Nuxt seemed to be the clear winner. There was 2.0.0 major release and good documentation, and we decided to take a risk with a new technology on a new project. And so we took Nuxt as a framework for clusterjobs.

Deployment and CD With Nuxt

To save some time on manual deployments, I invested couple of days in setting up a proper GitLab pipeline to deploy the app to Heroku.

The Nuxt docs are a great resource on how to deploy to Heroku. Here’s a great article on how to deploy Vue on Heroku in the GitLab pipeline.
Combine them together — and boom! This is what I have at the moment:

image: node:10.15.3

 - npm install
 - node_modules/
 - .yarn
 - build
 - test
 - deploy
Build clusterjobs:
 stage: build
 - yarn config set cache-folder .yarn
 - yarn install
 - yarn run build
 stage: test
 - yarn config set cache-folder .yarn
 - yarn install
 - yarn test
Deploy master:
 stage: deploy
 - master
 # add remote heroku
 - git remote add heroku https://heroku:$
 # prepare files
 - git checkout master
 - git config - global ""
 - git config - global "Mikhail Starikov"
 # put prod robots file where it belongs
 - rm ./static/robots.txt
 - cp -f ./static/ ./static/robots.txt
 - git add ./static/robots.txt
 - git commit -m 'prod robots'
 # push
 - git push -f heroku HEAD:master


A Year of Development

After the environment was done, it took roughly 2–3 months to prepare MVP and go live. After numerous iterations and improvements, I still don’t regret choosing Nuxt.

So why is it good? I thought of the best moments I’ve experienced, and here they are:


It’s performant. Even though it is a full JS framework that needs to deliver all library files to the client, it still tries its best to do it in the least harmful way.

This is image title

With the last 2.10 update, I found out the webpack config has been updated so that during development only the updated chunks are rebuilt, which really speeds up development.

Also webpack for production is extendable, and you can play around with it on your own or use the default config, which is pretty performant on its own.

build: {
  parallel: true,
  terser: true,
  extend(config, ctx) {
    if (process.env.NODE_ENV !== 'production') {
      config.devtool = '#source-map';
    if (ctx.isDev && ctx.isClient) {
          enforce: 'pre',
          test: /\.(js|vue)$/,
          loader: 'eslint-loader',
          exclude: /(node_modules)/,
    if (
      config.optimization.splitChunks &&
      typeof config.optimization.splitChunks === 'object'
    ) {
      config.optimization.splitChunks.maxSize = 200000;



The advantage is that I, as a developer, didn’t need to think about where to put this or that. Nuxt comes with a skeleton of an app, with everything you need to build a complex web app: pages, components, assets, static, middlewares, plugins, and so on.

The only thing that annoyed me is that Nuxt encourages you to use _~/component/blah-blah_ kind of stuff to import all over the application.
JetBrains IDE, which love with the bottom of my heart, couldn’t recognize those paths.

This is image title

The workaround for that is pretty simple:

const path = require('path');

// eslint-disable-next-line nuxt/no-cjs-in-config
module.exports = {
    resolve: {
        alias: {
            '~': path.resolve(__dirname, './'),

This is image title


The community is thriving. A huge thanks is due to Sebastien Chopin, who created Nuxt itself and has continued driving it until the current moment. Another huge thanks is due to the core team and all of its contributors for such an amazing product.

If you’ve tried Nuxt, you probably know these resources, but I’ll just put them here anyway:


That is the thing that makes you love Nuxt, really.

Coming from such a great community, Nuxt has readjusted Vue modules, new modules, and modules for everything. Found some not covered use case in Nuxt? Write a module, and make it Nuxt-community open source!
Here is a list of modules I used in production:

  • i18n
    Internationalisation, with multi-domains for each language, working out of the box. Like isn’t it awesome? Languages and separate domains is crucial for SEO and could improve your presence in Google results list heavily. And here you just need to add module, integrate it with your UI and that’s it.
  • sitemap
    A super important thing that’s needed for every prod website. This module will generate a sitemap based on your routes. You could also use Axios to request your API and get all dynamic routes (or whatever you want).
  • svg
    Use SVG all over the app, but load them from auto-generated sprites
  • apollo
    GraphQL is awesome
  • pwa
    PWA is our future — try to investigate this topic, if you still haven’t done it yet! Samsung started to show PWA apps in the Galaxy store.
  • sentry
    Get to know your user’s pain with this awesome service that’ll log all production errors for you
  • GA, GTM
    Necessary evil to track you app performance


There were some problems, of course, during my year of working with Nuxt.
Now I’ll try to give context for each of them and help you avoid them in the future:

Shared state on multiple requests in Nuxt

This is related to how Node.js works. If you have a global variable, it’ll be overwritten in a simultaneous request. Some insights are given in this Stack Overflow question.

The problem I experienced was related to fetch function on my offer-list page (search results).

I was making an action call like:

await store.dispatch('serverSearch', {
    query: paramQuery,
    page: paramPage,

That was done to populate the store on the server side and to use the same offers on the client side.

But when it’s done inside an action, like action -> commit -> store, then for some reason that data is mixed.

I confess, I didn’t investigate the true reason for that — maybe some global object of the Vuex store or something like that, but the problem was that
while I had my application running for the first request, every next request got its state. So you might end up landing on [“fullstack developer” job offers page]( developer) and having machine-learning engineer results.

The fix for that was:

const offersData = await store.dispatch('serverSearch', {
 query: paramQuery,
 page: paramPage,
await setResults(offersData, paramPage, store.dispatch.bind(store));
await store.dispatch('serverSetQuery', paramQuery);

So action -> back to fetch -> commit -> state. The action should return a promise that is resolved with proper data, which you could use back in the fetch function.

After that point, commit calls will probably be close to the end of the fetch and the page will have the correct data, but the general problem might be still there.

Heroku and is-https

I am hosting the app using Cloudflare for DNS and Heroku as a server. Pointing the domain to Heroku is done through CNAME, which is giving me some problems.

Several modules of Nuxt (sitemap, i18n) are using the is-https library to identify on the server side the type of request. The request which is done to Cloudflare is HTTPS but the proxying probably isn’t.nI got some advice on CMTY on that.

Enabling x-forwarded-proto should help, but I haven’t tried it yet.

this everywhere

Personally I like to write functional code in JS. It’s possible with Nuxt, but all the modules makes you use this.

Want to get to the current locale in the Vuex store or in the component? The same goes for switching the locale and getting all locales list.

Want to change pages in Vuex? this.router.push

I can live with that, but having those objects as an argument inside functions also could benefit better code separation.


I love RX and love to apply it to state-managing use cases, especially.
RX could be integrated into Vue — and into Nuxt as well, if we’re talking about DOM events. There’s this package.

To integrate it into the Nuxt app, just create a plugin like this:

import Vue from 'vue'
import Rx from 'rxjs/Rx'
import VueRx from 'vue-rx'

Vue.use(VueRx, Rx)


There were also a couple of trials to integrate it into Vuex, but so far, the repo is deprecated. I haven’t seen any articles regarding this lately.


All in all, I love Nuxt. I even prepared a workshop for my fellow colleagues and did it a couple of times to spread the knowledge and encourage them to try it.

I think it’s a very mature and developed tool for any need. You could use it for everything from simple static landing pages and personal websites up to complex web applications and e-commerce platforms.

I faced some caveats, which were fixable, but I also had a lot of great moments, when everything felt so simple and worked awesome. I truly believe in this framework and am deeply grateful to the people that created it and are maintaining it still.

#vuejs #vue #javascript

What is GEEK

Buddha Community

A Genuine Review of the Framework A Year With Nuxt.js

Thanks for your overview!
It was interesting.

NBB: Ad-hoc CLJS Scripting on Node.js


Not babashka. Node.js babashka!?

Ad-hoc CLJS scripting on Node.js.


Experimental. Please report issues here.

Goals and features

Nbb's main goal is to make it easy to get started with ad hoc CLJS scripting on Node.js.

Additional goals and features are:

  • Fast startup without relying on a custom version of Node.js.
  • Small artifact (current size is around 1.2MB).
  • First class macros.
  • Support building small TUI apps using Reagent.
  • Complement babashka with libraries from the Node.js ecosystem.


Nbb requires Node.js v12 or newer.

How does this tool work?

CLJS code is evaluated through SCI, the same interpreter that powers babashka. Because SCI works with advanced compilation, the bundle size, especially when combined with other dependencies, is smaller than what you get with self-hosted CLJS. That makes startup faster. The trade-off is that execution is less performant and that only a subset of CLJS is available (e.g. no deftype, yet).


Install nbb from NPM:

$ npm install nbb -g

Omit -g for a local install.

Try out an expression:

$ nbb -e '(+ 1 2 3)'

And then install some other NPM libraries to use in the script. E.g.:

$ npm install csv-parse shelljs zx

Create a script which uses the NPM libraries:

(ns script
  (:require ["csv-parse/lib/sync$default" :as csv-parse]
            ["fs" :as fs]
            ["path" :as path]
            ["shelljs$default" :as sh]
            ["term-size$default" :as term-size]
            ["zx$default" :as zx]
            ["zx$fs" :as zxfs]
            [nbb.core :refer [*file*]]))

(prn (path/resolve "."))

(prn (term-size))

(println (count (str (fs/readFileSync *file*))))

(prn (sh/ls "."))

(prn (csv-parse "foo,bar"))

(prn (zxfs/existsSync *file*))

(zx/$ #js ["ls"])

Call the script:

$ nbb script.cljs
#js {:columns 216, :rows 47}
#js ["node_modules" "package-lock.json" "package.json" "script.cljs"]
#js [#js ["foo" "bar"]]
$ ls


Nbb has first class support for macros: you can define them right inside your .cljs file, like you are used to from JVM Clojure. Consider the plet macro to make working with promises more palatable:

(defmacro plet
  [bindings & body]
  (let [binding-pairs (reverse (partition 2 bindings))
        body (cons 'do body)]
    (reduce (fn [body [sym expr]]
              (let [expr (list '.resolve 'js/Promise expr)]
                (list '.then expr (list 'clojure.core/fn (vector sym)

Using this macro we can look async code more like sync code. Consider this puppeteer example:

(-> (.launch puppeteer)
      (.then (fn [browser]
               (-> (.newPage browser)
                   (.then (fn [page]
                            (-> (.goto page "")
                                (.then #(.screenshot page #js{:path "screenshot.png"}))
                                (.catch #(js/console.log %))
                                (.then #(.close browser)))))))))

Using plet this becomes:

(plet [browser (.launch puppeteer)
       page (.newPage browser)
       _ (.goto page "")
       _ (-> (.screenshot page #js{:path "screenshot.png"})
             (.catch #(js/console.log %)))]
      (.close browser))

See the puppeteer example for the full code.

Since v0.0.36, nbb includes promesa which is a library to deal with promises. The above plet macro is similar to promesa.core/let.

Startup time

$ time nbb -e '(+ 1 2 3)'
nbb -e '(+ 1 2 3)'   0.17s  user 0.02s system 109% cpu 0.168 total

The baseline startup time for a script is about 170ms seconds on my laptop. When invoked via npx this adds another 300ms or so, so for faster startup, either use a globally installed nbb or use $(npm bin)/nbb script.cljs to bypass npx.


NPM dependencies

Nbb does not depend on any NPM dependencies. All NPM libraries loaded by a script are resolved relative to that script. When using the Reagent module, React is resolved in the same way as any other NPM library.


To load .cljs files from local paths or dependencies, you can use the --classpath argument. The current dir is added to the classpath automatically. So if there is a file foo/bar.cljs relative to your current dir, then you can load it via (:require [ :as fb]). Note that nbb uses the same naming conventions for namespaces and directories as other Clojure tools: foo-bar in the namespace name becomes foo_bar in the directory name.

To load dependencies from the Clojure ecosystem, you can use the Clojure CLI or babashka to download them and produce a classpath:

$ classpath="$(clojure -A:nbb -Spath -Sdeps '{:aliases {:nbb {:replace-deps {com.github.seancorfield/honeysql {:git/tag "v2.0.0-rc5" :git/sha "01c3a55"}}}}}')"

and then feed it to the --classpath argument:

$ nbb --classpath "$classpath" -e "(require '[honey.sql :as sql]) (sql/format {:select :foo :from :bar :where [:= :baz 2]})"
["SELECT foo FROM bar WHERE baz = ?" 2]

Currently nbb only reads from directories, not jar files, so you are encouraged to use git libs. Support for .jar files will be added later.

Current file

The name of the file that is currently being executed is available via nbb.core/*file* or on the metadata of vars:

(ns foo
  (:require [nbb.core :refer [*file*]]))

(prn *file*) ;; "/private/tmp/foo.cljs"

(defn f [])
(prn (:file (meta #'f))) ;; "/private/tmp/foo.cljs"


Nbb includes reagent.core which will be lazily loaded when required. You can use this together with ink to create a TUI application:

$ npm install ink


(ns ink-demo
  (:require ["ink" :refer [render Text]]
            [reagent.core :as r]))

(defonce state (r/atom 0))

(doseq [n (range 1 11)]
  (js/setTimeout #(swap! state inc) (* n 500)))

(defn hello []
  [:> Text {:color "green"} "Hello, world! " @state])

(render (r/as-element [hello]))


Working with callbacks and promises can become tedious. Since nbb v0.0.36 the promesa.core namespace is included with the let and do! macros. An example:

(ns prom
  (:require [promesa.core :as p]))

(defn sleep [ms]
   (fn [resolve _]
     (js/setTimeout resolve ms))))

(defn do-stuff
   (println "Doing stuff which takes a while")
   (sleep 1000)

(p/let [a (do-stuff)
        b (inc a)
        c (do-stuff)
        d (+ b c)]
  (prn d))
$ nbb prom.cljs
Doing stuff which takes a while
Doing stuff which takes a while

Also see API docs.


Since nbb v0.0.75 applied-science/js-interop is available:

(ns example
  (:require [applied-science.js-interop :as j]))

(def o (j/lit {:a 1 :b 2 :c {:d 1}}))

(prn (j/select-keys o [:a :b])) ;; #js {:a 1, :b 2}
(prn (j/get-in o [:c :d])) ;; 1

Most of this library is supported in nbb, except the following:

  • destructuring using :syms
  • property access using .-x notation. In nbb, you must use keywords.

See the example of what is currently supported.


See the examples directory for small examples.

Also check out these projects built with nbb:


See API documentation.

Migrating to shadow-cljs

See this gist on how to convert an nbb script or project to shadow-cljs.



  • babashka >= 0.4.0
  • Clojure CLI >=
  • Node.js 16.5.0 (lower version may work, but this is the one I used to build)

To build:

  • Clone and cd into this repo
  • bb release

Run bb tasks for more project-related tasks.

Download Details:
Author: borkdude
Download Link: Download The Source Code
Official Website: 
License: EPL-1.0

#node #javascript

ClientFinda Review - Recommended or Not?

### ClientFinda Review

Do you have trouble attracting clients? You’re not by yourself.
Starting a business is not difficult, but growing a business can be difficult over time. The reason for this is that you require consistent cash flow.
Cash flow failure is one of the leading causes of failure in fast-growing businesses.

Sometimes an exciting increase in sales outpaces your ability to finance it. This is particularly difficult because you have become a victim of your own success.
Plan carefully for expansion, and especially ensure that you have solid sources of funding to support your expansion before it occurs. At the very least, if you over-plan and sales don’t skyrocket to the level you anticipated, you won’t be financially embarrassed.
And the only way to have consistent cash flow is to have customers who will pay for your goods or services.
Obtaining quality clients can be a real pain in the neck for your company.
I’ll show you the best way to find them, as well as the best tactics and system to employ.
According to statistics;

Only about 20% of new businesses survive their first year in business.

In the first five years, half of all small businesses fail.

These statistics can be frightening, whether you’re a seasoned small business owner or a first-time entrepreneur.
You’ve come to the right place if you want to get quality clients for your business, no matter what niche you serve or whether it’s a service or product-based business. Then get ready for the new ClientFinda App, which will go live on July 22nd, 2021.
Based on the positive buzz surrounding this software, I decided to conduct an in-depth review. ClientFinda is a game-changing platform… very much needed… and solves a HUGE problem for your company.
We’ll go over how it works, who it’s for, how much it costs, the incredible bonuses, the upsells, and the pros and cons of this new tool so you can make an informed purchase decision… and, of course, whether it is appropriate for you.
What Exactly Is ClientFinda?
ClientFinda combines the power of Artificial Intelligence (AI), Natural Language Processing (NLP), and Machine Learning (ML) to conduct a deep search for quality buyer leads in ANY niche.
All you have to do is answer a few questions and you’re done…
The ClientFinda AI wizard generates laser-targeted and pre-qualified buyer leads that are ONLY interested in your services and have specific requirements.
How Does It Operate?
Client Finda can be set up to work for you in three simple steps.
Step 1: Enter Your Audience Filters for Your Target Audience (Location, Niche, Social Media Presence, Online Reviews etc.)
Step 2: Look at the companies that are most likely to buy your services.
(AI, NLP, and ML powered results… ensuring 99.99 percent accuracy)
Step 3: Contact the clients who are most likely to purchase your services so that you don’t waste time and money on dead leads.
Who Is It Intended For?
works in the following fields:

Realtors and real estate


Listings on Airbnb

Automobile Sales

Recreation and travel

Computer games

Music and film

Retail and online shopping


Video Promotion


Whatever your audience type is-SMM, Content Marketing, Website Builder, Paid Ads, Email Marketing, SEO, Ecommerce, Traffic, Agency & MMO, and so on.
This offer is ideal for you because EVERYONE requires buyer leads.
ClientFinda Advantages
You can discover whether or not your potential lead is running ads, as well as the type of ad they are running. The identification of ad mediums is done for you across platforms—Facebook, Messenger, Instagram, Adwords…
You can then reach out to them with ready-to-use ads OR an ad service proposal if they don’t run ads at all based on their brand needs and preferences!
You will be able to provide the following services to your customers:

GMB Standing

They haven’t yet created a Google My Business listing? Great, now is your chance to jump right in and save the day!

Google PageRank

How high does your company rank on Google? Does the website make good use of optimization? If not, sell them on your knowledge.

Advertisement Pixels

Do they have ineffective advertisements? As soon as you connect with them, sell high-converting ads to them, almost as if you could read their minds!

Google Analytics is a web analytics service.

Determine whether or not your lead is using Google Analytics to track and grow their brand on their website.
If not, step in to save the day and get paid for it.

Markdown Schema

Find websites that do not use schema markup and contact them so you can offer them your services and charge them top dollar for them.

Linkedin Page

Find out if the company has an existing LinkedIn profile, as well as information about their connections…

Facebook Page

Determine whether the company has a Facebook account, as well as statistics such as page likes, posts, and activity…


Check to see if the company is on Twitter… with information such as the number of followers, tweets, and retweets!

What is the cost?
Incredibly, and this is one of the aspects of this offer that fascinates me…
ClientFinda and all of the awesome bonuses are available for a TINY one-time fee of $37… Can you outdo that?
That is a very small fraction of its true value, market cost, and income potential!
Furthermore, this small investment is backed by a solid ZRO RISK 14-day money-back guarantee, allowing you to test run the software with no risk on the part of the product creator.
However, keep in mind that this low one-time fee is only valid during the launch special period. DON’T MISS OUT!
What Exactly Are the Upsells?
ClientFinda PRO-$67/month is the first upsell.
Users can conduct UNLIMITED searches, generate UNLIMITED leads, close UNLIMITED clients, and profit UNLIMITEDly for a low one-time fee!

Upsell 2: $67 for Outreachr-AI Cold Email Writer.

Outreachr is a fully automated lead communication system powered by AI.

$97 for DFY Digital Marketing Services
Get Instant Access to TEN Full-Blown Digital Marketing Service Kits and start offering in-demand digital marketing services to your NEW & EXISTING clients.

Resellify + ClientFinda Reseller-$97, $297
RESELL the CleintFinda app under your own name and KEEP 100% of the profit. Selling software products is a simple way to make money.
Get Reseller Rights to FIVE High-Quality Software Apps, as well as Professionally Designed Sales Pages and Marketing Materials.
The benefits are obviously numerous, but I’ll only mention a few:

Increased conversions are guaranteed.

Innovative technology

The greatest possible global reach

It is extremely simple to use.

It is simple to set up.




The Funnel is quite deep; there are four separate upgrade options: this isn’t much of a con because the software works perfectly without any of the upgrades.

You will require a strong internet connection.

To summarize, if you want to keep your business running without worrying about not having enough clients or running out of cash, ClientFinda is your best friend.
As a result, on this note, I’ll say that ClientFinda is a timely solution that I strongly recommend.
Without a doubt, I rate it a five-star rating. Anything else will be labeled “BIAS!”
You may proceed to secure your access. Your investment is both SAFE and WISE. Cheers!

#clientfinda review #clientfinda review and bonus #clientfinda review bonus demo #clientfinda review bonus #clientfinda review demo #clientfinda reviews

Lupe  Connelly

Lupe Connelly


Create Dating App (Vue Js Capacitor) Using Nuxt Js, Laravel, Socket IO - #1

Give me a design and coding challenge !

Day for #100DaysOfCode Challenge

Sources :
Trello :

#laravel #nuxt #nuxt js #socket io #vue js

Lupe  Connelly

Lupe Connelly


Create Dating App (Vue Js Capacitor) Using Nuxt Js, Laravel, Socket IO - #3

Give me a design and coding challenge !

Day for #100DaysOfCode Challenge

Sources :
Trello :

#vue #vue js #nuxt js #nuxt #laravel #socket io

Hire Dedicated Node.js Developers - Hire Node.js Developers

If you look at the backend technology used by today’s most popular apps there is one thing you would find common among them and that is the use of NodeJS Framework. Yes, the NodeJS framework is that effective and successful.

If you wish to have a strong backend for efficient app performance then have NodeJS at the backend.

WebClues Infotech offers different levels of experienced and expert professionals for your app development needs. So hire a dedicated NodeJS developer from WebClues Infotech with your experience requirement and expertise.

So what are you waiting for? Get your app developed with strong performance parameters from WebClues Infotech

For inquiry click here:

Book Free Interview:

#hire dedicated node.js developers #hire node.js developers #hire top dedicated node.js developers #hire node.js developers in usa & india #hire node js development company #hire the best node.js developers & programmers