simpletut / universal-react-apollo-registration Goto Github PK

Hello,

Firstly thanks for your work - I am new to Node and thought your project would be a perfect place to start.

I've followed the instructions and the app builds and runs however none of the buttons work...

On running npm test - all tests fail and I get the message below for each of the 18 tests:

Requires Babel "^7.0.0-0", but was loaded with "6.26.3". If you are sure you have a compatible version of @babel/core, it is likely that something in your build process is loading the wrong version. Inspect the stack trace of this error to look for the first entry that doesn't mention "@babel/core" or "babel-core" to see what is calling Babel. (While processing preset: "C:\Users\Mark\Desktop\Universal-React-Apollo-Registration\node_modules\@babel\preset-env\lib\index.js")

I've upgraded my version of babel to v 7.0.0 via npm but I still get the same errors...

I am very new to node so may be doing something wrong but I would have thought that cloning the repo, running npm install and the other commands from the instructions given would have resulted in a working application or at least the correct components...

Am I wrong in thinking this? - I am new and still haven't got my head around how npm and other package managers work - and to be honest they all seem as flaky as hell... maybe that's because I don't understand them well enough yet...

Can you point me in the right direction - I would think that other newbies may run into the same issue and it would be a shame for them not to use this after the hard work you must have put into it...

Thanks

For instance:
There is a page that it can be accessed by anyone once they are logged but each user has a different permission.
User x can read the article, but user y can do it and also edit the article and user z can do both but with a additional feature.

could be a nice feature if there is a page that we can set the permission to a certain user group and the just add users to each group.

How can I use this?

Is there something implemented?

While sign in and reload a page instant logout appears.

I can bring up the server, but when I try to visit localhost:3000 using my browser, the server crashes and giving me this error:

App running on port 3000
Connection to DB successful
/Users/hugangyu/xuetantan/Universal-React-Apollo-Registration/node_modules/zen-observable/lib/Observable.js:63
throw e;
^

TypeError: Cannot read property 'delete' of undefined
at /Users/hugangyu/xuetantan/Universal-React-Apollo-Registration/node_modules/apollo-link-dedup/lib/dedupLink.js:48:47
at cleanupSubscription (/Users/hugangyu/xuetantan/Universal-React-Apollo-Registration/node_modules/zen-observable/lib/Observable.js:90:7)
at notifySubscription (/Users/hugangyu/xuetantan/Universal-React-Apollo-Registration/node_modules/zen-observable/lib/Observable.js:145:41)
at onNotify (/Users/hugangyu/xuetantan/Universal-React-Apollo-Registration/node_modules/zen-observable/lib/Observable.js:165:3)
at SubscriptionObserver.complete (/Users/hugangyu/xuetantan/Universal-React-Apollo-Registration/node_modules/zen-observable/lib/Observable.js:229:7)
at /Users/hugangyu/xuetantan/Universal-React-Apollo-Registration/node_modules/apollo-link-dedup/lib/dedupLink.js:34:81
at Set.forEach ()
at Object.next (/Users/hugangyu/xuetantan/Universal-React-Apollo-Registration/node_modules/apollo-link-dedup/lib/dedupLink.js:34:45)
at notifySubscription (/Users/hugangyu/xuetantan/Universal-React-Apollo-Registration/node_modules/zen-observable/lib/Observable.js:130:18)
at onNotify (/Users/hugangyu/xuetantan/Universal-React-Apollo-Registration/node_modules/zen-observable/lib/Observable.js:165:3)
at SubscriptionObserver.next (/Users/hugangyu/xuetantan/Universal-React-Apollo-Registration/node_modules/zen-observable/lib/Observable.js:219:7)
at /Users/hugangyu/xuetantan/Universal-React-Apollo-Registration/node_modules/apollo-link-http/lib/bundle.umd.js:95:30
at processTicksAndRejections (internal/process/next_tick.js:81:5)
[nodemon] app crashed - waiting for file changes before starting...

I'm following the video exactly and I'm using yarn to install and manage packages.

is it server-side rendering? i don't know yet react (ssr) so i asked :|

Hi!

There is a typo in the cors options in the server.js file line 47.

There is a key named "origon" instead of "origin".

There is no variable.env file. I followed the instructions and I get an Error: Environment variable 'dbString' is not defined.

Hello,

I'm not sure if this is something you can help with as I don't know if this is a webconfig issue or more nginx orientated - but I am trying to dockerise this application and reverse proxy it using nginx.

Do you know if this application can be reversed proxied?

When I try to set a location in my nginx config as an entry point for the applciation, none of the assets are loaded on the relative path I set and the links on the page all point to the root of my nginx server and not the location I set in my nginx.conf file...

I have reversed proxied another node application (express based) and this seems to work without issue so I am not sure if there is something in the architecture of this app that will prevent me from reverse proxying it...

I am trying to make this app available on the following url

http://domain-name/memberdemo

I am reverse proxying an express base site to http://domain-name and that works fine...

The entries in my nginx.conf file are as follows:

    location / {
    proxy_pass http://192.168.1.104:3000/;
    proxy_set_header Upgrade $http_upgrade;
    proxy_set_header Connection 'upgrade';
    proxy_set_header Host $host;
    proxy_set_header X-Real-IP $remote_addr;                       
    proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;  
    }

below is the location block I am trying to host your app on

    location /memberdemo/ {
    proxy_pass http://192.168.1.66:3000/;
    proxy_set_header Upgrade $http_upgrade;
    proxy_set_header Connection 'upgrade';
    proxy_set_header Host $host;
    proxy_set_header X-Real-IP $remote_addr;                       
    proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for; 

    }

The first location block reverse proxies to a host on my lan running an express based application and works fine as all assets are loaded and the links work as needed...

The second location block reverse proxies to the universal react app running on another machine on my lan - if I enter http://192.168.1.66:3000 in my browser the app loads as expected with all assets loaded and the links work as needed from my client machine...

If I try to access it through the reverse proxy no assets are loaded and all the links point to the location of the first 'location' block as shown above so I get page not found when I click on them...

e.g.

When I go to http://domain-name/memberdemo

I see the universal app load its default page but no assets are loaded and I see 'not found' errors in the browser console - if I hover or click on a link on the un-styled page the links point to the root of my nginx server so I get a not found error if clicked...

I know this may not be an issues with your application but I have been trying for days to find a way to make this work so I thought I might ask you if you know of any issues that may be effecting this... or reasons why this application can not be reverse proxyed...

My webconfig looks like this:

{
"siteURL": "http://192.168.1.66:3000",
"environment": "production"
}

Thanks for any help or pointers you can give...

Thank you for making the changes - I can now build the app and it works locally - however - I tried to clone and build the app on another machine (an old linux laptop) and when I do, it builds and starts as expected but I get the following error messages in the browser when I try to access it remotely on the machineIP:3000 - it seems it is looking to load the css, js and image assets from 'localhost' as I see the below in the browser console:

GET http://localhost:3000/assets/css/styles.min.css net::ERR_CONNECTION_REFUSED
http://localhost:3000/client_bundle.js net::ERR_CONNECTION_REFUSED
http://localhost:3000/assets/graphics/favicon.ico net::ERR_CONNECTION_REFUSED

I tested this by starting an instance of the application on my local windows machine and then refreshing the page to the linux laptop and the page loads as expected (it must be accessing the assets from the instance running on my local windows machine) as when I kill the app on the local windows machine and refresh the page the assets don't load again and I get the net::ERR_CONNECTION_REFUSED message...

Is there away to fix this so that the app looks to the IP running the app so that it can be accessed from another machine, as at the moment it seems that it will only work locally...

Thanks for your work on this project - it is excellent and getting this working has been a good learning experience for me...

Hey do you intend to move it to 16.8 anytime soon? I am trying but I'm unable to upgrade depreciated libraries with new ones, without the project failing. I'll try to setup a new project with the ideas from this repo. Perhaps add the lock file so "npm i" just works.