Vue3 Pouchdb example - vuejs3

I try to get Vue3 and Pouchdb working. There are many examples for Vue2 with pouchdb but there is simple no example for Vue3.
All my attempts to adapt some of the code for Vue2 did not lead to working code. Why is there nothing about Vue3 and pouchdb? What do I miss?

I also don't know.. but what I've noticed is the pouchdb- tools out there are all old and unmaintained.
I did find - https://dev.to/craftzdog/a-performant-way-to-use-pouchdb7-on-react-native-in-2022-24ej
I'm planning to fire up a vue app and see if following - https://pouchdb.com/guides/databases.html works..
One thing I have noticed is that CouchDB/pouchDB is no longer the 'shiny thing' and so people are chasing the latest.. However, I got Pouchdb to load and create a DB.. will push a MWE later

Related

Does MUI require all pages to be CSR when using the new app directory in NextJS 13

I just started my first NextJS app and followed this guide to add MUI. The only difference I can see is that I'm using the experimental app directory of NextJS 13.
When following the guide, I get a server error of Uncaught TypeError: React.createContext is not a function which is basically rather clear, as the context API is only available to client components and can therefore rather easily be "solved" by placing the 'use client'; directory on top of the erroneous component.
Unfortunately it seems like this is required for every component which uses any part of MUI. E.g. I'd also have to 'use client;' in my root layout.tsx if I'd like to wrap my whole app with the ThemeProvider etc.
My questions are the following:
Do I really have to 'use client;' everywhere I'd like to use MUI or is there some other way around?
If 1 is true: Doesn't this make MUI completely useless in combination with NextJS as it prevents the usage of all the SSR, SSG, ISR goodness etc or do I have some kind of misunderstanding here (I'm very new to NextJS in general...)?
If 1 & 2 are true: Are there other recommendable UI frameworks or libraries which bring a good set of "ready to use" (and out of the box good looking) controls, components etc. that work better with NextJS without those limitations?
FYI, I have the following versions installed ATM:
next#13.0.6
#mui/material#5.10.17
Update
I should have read the NextJS beta docs more careful before posting the question:
It seams like there's no way around this ATM as stated here in the docs and again here in the a ticket.
So this answers question 1, as there doesn't seem to be a way around 'use client'; for now.
However, I'd still really appreciate answers and opinions on questions 2 & 3.

Any Angular2 Meteor Material working example?

Back in the day I successfully created an app with meteor and blaze, and applied material design to it.
Needless to say, I was very excited meteor and angular were getting paired up, so a few weeks ago I finally got around to giving it a try.
But, no matter what I try, I simply cannot get Material UI to work with angular2-meteor.
I cloned and tried https://github.com/Urigo/meteor-angular2.0-socially just this morning, can't get it to work - no matter how many errors I fix, it still finds new ones. Now it claims it cannot find the scss and html files, which are right there, even the EDA finds it with ctrl+click.....
I cloned and tried https://github.com/0mkara/meteor-ng-material-baby - same thing, endless errors, can't get it to work...
To make the long story short, is there any tutorial or clonable package which works with meteor angular2 material?

meteor.js and React - does the server rendering for SEO works out of the box?

I read some docs and still confused. It explains some technical details - like how you can inject something into <head> and <body> tags etc.
I don't quite understand it, it seems like you need to write some special code to make server side rendering work.
In next.js Server-Side Rendering works out of the box. I wonder if there's a similar way to make it works out of the box in Meteor.JS + React - without writing any additional special code?
AFAIK, there is no out-of-box solution for SSR in Meteor. Meteor does have lots of Out-of-box features but SSR is not one of them.
You can read about how to do it in Meteor + React projects here.
https://docs.meteor.com/packages/server-render.html
alternate option:
You can use prerender for seo and we have good working product using Prerender in couple of my Meteor + Blaze projects.

Multiple projects all using redux on the same page

Let's say for example I am working on a website which makes use of redux. Then I want to import a different project, e.g. some embedded app, which also uses redux.
So then I have a website written using react & redux, with an embedded app, which also uses react & redux, but neither projects know that the other project uses redux.
Will this be a problem? Will there be any conflicts? And how would the chrome redux plugin work? Would it be able to pick up both redux stores?
Depends on how you plan to embed. It should not be problem.
About Chrome Redux plugin, I'm not sure about this.
you can use IFrame. There should ideally be no problem doing this, till you are on the same domain.
or
If you choose the Web-component way. It will give you shadow dom inside. This can be used to create a widget which then can be used anywhere without conflicting with parent in anyway.
see the
https://auth0.com/blog/web-components-how-to-craft-your-own-custom-components/
hope this helps.

Is there any way to make Brackets' Live Preview feature work on Meteor projects?

I am styling a project built on Meteor and using LESS. I use Brackets for styling because its Live Preview feature makes working with CSS a lot quicker and more pleasurable, but by Meteor's nature it doesn't seem possible to use this feature.
Every little change I make on the code has to be detected by Meteor, who will in turn refresh the project on the browser for me, and this process is now taking anything between 5 and 10 seconds, which is entirely too much.
Does anyone know if it's possible to work on "live" CSS/LESS, using Brackets, in a Meteor project, without having to wait for Meteor to notice my changes and take its sweet time to refresh the whole thing for me?
Or at the very least least if there's anything I can do to shorten the time Meteor takes to update?
I don't think it is possible unless the developers of Brackets go an extra mile and implement a specific support tailored for Meteor.
Brackets works on top of raw CSS and HTML files and uses Chrome Dev Tools API to manipulate the page.
Meteor doesn't send raw files to the client. HTML templates in Meteor get compiled to JS DSL and CSS is concatenated and sent in a manipulated form, too.
Bracket's live preview feature would work only with quick page layout prototyping and will not play well with any modern front-end tool chain that involves compiling pages and stylesheets or preprocessing.

Resources