The Loop Tech - Vuejs (Leamsigc)

In the nuxt docs for Cloudflare deployment (https://nuxt.com/deploy/cloudflare), it mentions two options of nuxt build or nuxt generate. It says:

"To leverage server-side rendering on the edge, set the build command to: nuxt build vs To statically generate your website, set the build command to: nuxt generate"

What are the pros and cons to each approach here? Is it as simple as SSR vs SPA? Will it matter if for example I choose nuxt build for SSR but have areas in my app that are [ClientOnly] ?

Blog

The Resource of the week is:

• https://vuejstips.com

They provide tips related to

1. Vuejs
2. Nuxt
3. Vite

You can see small examples of the tip on how to use them, base on the filter that you provided.

For me, one of the tips that I’m currently using is the Nuxt Content Module, Experimental feature related to search.

That will give you the possibility of search in any of your documents:

With some simple configuration and a composable, you can add search to your Nuxt Content site.

While working in the nuxt-layer-monorepo I encounter an issue with the tailwind styles:

• UI Layer have a tailwind config file and override the default tailwind CSS configurations
• Then using the UI Layer in the Content layer

Tailwind configurations got reset to the base for some reason, even that the layers' config should be use

So the solution that I found and is currently working is just to create a new tailwind.config.ts in the Content layer

How to load env variables for a Nuxt project in a monorepo

When working on project that use a monorepo with Nuxt Layers, we will need to load environment variables that are located on the root of the project

You can find the blog post https://dev.to/leamsigc/how-to-load-env-for-nuxt-layers-38g1

While working in an internal project, I got the task of getting the connection between keycloak and our nuxt application.

After an hour of research, I found two feasible options to get this working fast and easy.

1. manage the keycloak manually
2. Using # Nuxt OpenID-Connect Module

• Daniel Roe

  1. Nuxt core member
  2. Creator of a lot of the nuxt Modules.

• vueschool

  1. The conference section is amazing
  2. You can get a lot overview on where the framework is going after listening to a couple talks

• Alexander Lichter

  1. All themes related to Nuxt & Vuejs
  2. Host of the DejaVue Podcast
  3. Nuxt core member

• John Komarnicki

  1. Small easy to digest videos related to nuxt and vuejs
  2. Excellent explanations about on how and why he is doing what he is doing in the video

• Tim Benniks

  1. Love the touch of music on the videos of Tim
  2. One of the topics that I like personally is how he manage to 100% on google speed with nuxt.

• Kaizen Codes

  1. Really nice examples of nuxt in real applications
  2. One of my favorite videos is Nuxt content blog & firebase

• # Behon Baker

After a while working with Nuxt, here are the top 10 Modules that I use in every single one of my projects.

• Nuxt Devtools
• Nuxt Tailwind

1. Using Tailwind CSS in your Nuxt project is only one command away.

### Developing a new theme for keycloak sometimes is hard if you have to clear the cache on every single change.

When working or developing a new keycloak theme it is better to set the configuration for the keycloak cache to false, that way every rebuild of the keycloak your changes are reflected right a way

For older version of keycloak the solution was to update the `standalone.xml`

then updating the `theme` tag

https://dev.to/leamsigc/vuejs-and-nuxt-challenges-where-to-practice-what-you-have-learned-4amb

Looking for a site where you can practice or put on practice your Vue.js skills,
well don’t look anymore, here is a hidden gem.

Vuejs-challenges

You can find challenges for all skill levels, from Beginner, intermediate & even expert level challenges.