Can PropTypes be used outside React? - node.js

So I need a type checking package like Proptypes which works on Nodejs. I've read their docs and noticed that they had mentioned about using proptypes outside React with checkPropTypes, but one of checkPropTypes parameters is a Component, which relate to React
Can I use Proptypes in nodejs? If not, can someone recommends a package that has cool things like shape,arrayOf in proptypes.
Thanks in advance.

Related

How to use konva in nestjs

I need konva to run on nodejs. I used this documentation from the creators themselves.
doc - https://github.com/konvajs/konva#4-nodejs-env
I myself use nestjs.
error
package.json
I solved this problem by changing the import
import Konva from 'konva';
on
const Konva = require('konva/cmj').default;

react js c'ant fetch from database - node js api server keeps loading

Hi guys i'am new in react js and node.js. So , I have a problem with fetching users list from database with node rest api
so at first this screen appears without displaying users list
then i had this error that i can't gues where the problem is !
help please
ps* excuse me for the captures i had problem with code publication
here is my userlist.js and app.js code
you are importing some components from react package at your UserList:
import { Button, ButtonGroup, Table } from 'react';
These components are going to be undefined since React doesn't have built-in components. These components import should come from another library or from the specific file if you've created them.
since you are using bootstrap you should import as:
import { Button, ButtonGroup, Table } from 'react-bootstrap';

next.js is it safe to import serverside script in clientside? [duplicate]

This question already has answers here:
How to best import "server-only" code in Next.js?
(3 answers)
Closed last year.
in next.js, we can use
getStaticProps (Static Generation): Fetch data at build time.
getStaticPaths (Static Generation): Specify dynamic routes to pre-render based >on data.
getServerSideProps (Server-side Rendering): Fetch data on each request.
to run serverside code, but in order to do that, I need to import serverside module in that script, for example, I want to import an authentication module to check the user is genuine or not in getserversideprops . (or database schemas, for example, mongoose)
Since I cannot import in a function, I have to import on the top of the file which means that anyone can see that import and see how I authenticate the user.
example:
import a from 'auth"
getserversideprops(){
if(a(req) ==true) ...
}
getServerSideProps will run only on the server and this code will not be bundled with the client or the final generated page. Since you should never ever ship the server side code to the client, Next.js already handles it.
Next.js is clever enough to see where you are going to use the imported script, if you are using it on the server, it wont be added to the bundle.

Trying to setup server-side rendering (SSR) on Google Firebase hosting

I have an Angular 7 site, that works fine without server-side rendering (SSR). I host it using Google's Firebase hosting. I now want to setup SSR. I followed this guide and got it to build and deploy to Firebase Hosting and Functions.
However, the site does not load and the Functions logs include this entry:
ERROR ReferenceError: document is not defined
at new CssKeyframesDriver (/user_code/node_modules/#angular/animations/bundles/animations-browser.umd.js:4246:26)
at instantiateSupportedAnimationDriver (/user_code/node_modules/#angular/platform-browser/bundles/platform-browser-animations.umd.js:412:88)
at _callFactory (/user_code/node_modules/#angular/core/bundles/core.umd.js:19867:24)
at _createProviderInstance (/user_code/node_modules/#angular/core/bundles/core.umd.js:19825:30)
at resolveNgModuleDep (/user_code/node_modules/#angular/core/bundles/core.umd.js:19786:25)
at _createClass (/user_code/node_modules/#angular/core/bundles/core.umd.js:19854:72)
at _createProviderInstance (/user_code/node_modules/#angular/core/bundles/core.umd.js:19822:30)
at resolveNgModuleDep (/user_code/node_modules/#angular/core/bundles/core.umd.js:19786:25)
at _callFactory (/user_code/node_modules/#angular/core/bundles/core.umd.js:19873:71)
at _createProviderInstance (/user_code/node_modules/#angular/core/bundles/core.umd.js:19825:30)
Any ideas of what is wrong? I can provide code snippets or individual read access to the repo if requested.
Server side rendering probably means serving HTML from Node.js w Express.js. In the Firebase suite of products, this is accomplished using Cloud Functions for Firebase's HTTP triggers.
You can have a look at Firebase Samples on Github. This is a relatively advanced implementation so proceed as long as you are strong in JavaScript, HTML, and CSS (not to mention Angular).
Angular SSR is trying to run angular animations but it's not able to find any document variable(there is no document on server-side).
You can solve this by conditionally executing your code with the help of isPlatformBrowser and isPlatformServer.
example
Import this
import { Component, PLATFORM_ID } from '#angular/core';
import { isPlatformBrowser, isPlatformServer } from '#angular/common';
User like this
constructor(#Inject(PLATFORM_ID) platformId: string){
this.isBrowser = isPlatformBrowser(platformId);
this.isServer = isPlatformBrowser(platformId);
if(this.isBrowser){
//Do something on the browser
}
if(this.isServer){
//Do something on the server
}
}

React: Is there any way to use componentDidMount() when rendering via node server

So I'm quite new to react and node, and found it easiest for me to use node (express) server and then just linking to react using CDN. Until now everything has worked fine this way, but I would like to use something like componentDidMount() for rendering a list of books. Googled a little and found out that componentDidMount() is not fired when rendering via the server. So I was wondering if there is an alternative way, that can do the same thing. Tried with componentWillMount() as well, but no change.
Thanks for any advice
It is not possible. In an isomorphic react app, componentDidMount will only be called after the hydration is done in the client.
So, if you want to render something based on props or state, you can use the class constructor or the legacy componentWillMount as these methods will be called during render done in node.
Hope this helps!

Resources