Error: Installation on windows

[KHBHH]

Hi,

I am trying to install washu app on my local PC using Windows 11. I npm version 8.9.0 and node version 18.2.0.

But I am having trouble when I do 'npm install'

You can see the last screenshotted error in below link:

I would appreciate some guidance and thanks for your help!

[lidaof]

Hi @KHBHH, it looks like the visual studio installation is required..last month I started with a fresh windows 11 and it worked and I put what I did here: https://eg.readthedocs.io/en/latest/installation.html#setup-on-windows, maybe you can take a look and give it a try? Thanks!

[KHBHH]

Hi @lidaof , thank you for getting back to me so quickly.

I reinstalled nodejs, and the above error was disappeared. Then I was not able to connect to the local host at all, I changed the start in package.json from start": "react-app-rewired start" TO "start": "react-scripts --openssl-legacy-provider start". After this process, it was able to connect but is throwing an error as described below...

Right now, when I run npm install and it tries to connect to the local host, the below error appears. What do you think this can be the result of?

[lidaof]

Hi @KHBHH so far we only have tested on react-app-rewired, i am not sure if react-scripts would work or not. Would you delete your current app code and re-pull from github do npm install and npm start?

[KHBHH]

Hi @lidaof, I reinstalled the whole code. I had to install new version of jest package (went to node_nodules, deleted jest packages) and ran npm i [email protected], after that, I was still having error when doing npm start, I changed the start in package.json from "start": "react-app-rewired start" to "start": "react-app-rewired --openssl-legacy-provider start", and now I can run it locally on my PC. Just wanted to share this information, as I think the new version of Nodejs was causing some trouble to connect to the localhost.

Thank you!

[lidaof]

Hi @KHBHH Glad you figured it out, that's very good to know and thanks for sharing!

[KHBHH]

Hi @lidaof, yes, thank you!

I just had another question, I am thinking to host this app on AWS, do you think I would need to create a docker for this? I am just wondering about the process.. And I believe WashU is compatible with AWS, right?

[lidaof]

Hi @KHBHH not sure if you know but https://epigenomegateway.org/browser/ is one of our mirror site running on AWS, we used S3 static web hosting, so you only need put everything under the build folder (after npm run build) in S3 for static hosting

[lidaof]

for track file hosting, you would need enable CORS for your s3 bucket, you can check more information from https://eg.readthedocs.io/en/latest/tracks.html#enable-cors-on-amazon-s3-bucket

[KHBHH]

Hi @lidaof , great to know about S3. How can I upload the app on S3? just upload the whole folder of the app (eg-react-master)? I would appreciate if you could guide me through the process as I am new to AWS. Thanks!

[lidaof]

Hi @KHBHH sure, there are lots of tutorial online, you can simply following aws's documentation: https://docs.aws.amazon.com/AmazonS3/latest/userguide/WebsiteHosting.html, feel free to ask me any question you may have.

[KHBHH]

Hi @lidaof, thank you for your support. I would also appreciate your advice about the following: As I would like washu to run on my AWS (my jobsite's):

• which way do you think is better? having web static hosting on S3? or creating a docker to live on AWS? (FYI: we also have our data on S3 as well)..
• In either way, which instance of App should I use? The one that I am already successfully running locally? Or the one downloaded from your github (no changed made to it)?

[lidaof]

Hi @KHBHH you are welcome! I guess all combinations should work. performance-wise I think running a static website in S3 with files after npm run build should be best. running the local version is easier for regular custom updates. you are ok to run the version with changes you made, just beware that if you pull a future version you might need to make similar changes again. In that case, you can make your own branch and merge future updates from the master branch.

[KHBHH]

Hi @lidaof,

I uploaded the frontend code to my s3 bucket on AWS, and trying to enable static web hosting. Which is in the index file that I should use? Should be the one in the /frontend/public/index.html , right? When I click on this file, nothing shows up...

Also, is it enough to have only the public folder (from the frontend folder) in my S3 bucket to run the app on my aws instance? Or I should have the whole eg-react-master folder on S3?

I would appreciate your guidance, thanks!

[lidaof]

Hi @KHBHH i assume you can run the local dev server successfully with npm start? then you need run npm run build, this will generate a build folder (if it doesn't exist) then you can upload all file under build folder to s3 for static website hosting, use index.html for both index.html and error.html. and that's enough for hosting a browser mirror site.

let me know you encounter any issue.

[KHBHH]

Hi @lidaof, thank you for getting back to me.

So I did run npm build, and it created a folder (build) inside the frontend folder. I uploaded the contents of the build folder into my S3 bucket. Then I did the following:

• enabled static web hosting on my s3 bucket where I have the contents of build folder
• I turned the 'Block all public access' off
• enabled CORS as described in your documentation (by adding the json file)
• gave bukcet policy as such: { "Version": "2012-10-17", "Statement": [ { "Sid": "PublicReadGetObject", "Effect": "Allow", "Principal": "", "Action": "s3:GetObject", "Resource": "arn:aws:s3:::chroma-compeng-dev/" } ] }

Later, when I run the link (http://chroma-compeng-dev.s3-website-us-east-1.amazonaws.com/) from static web hosting such as: I am getting a blank page...

I would highly appreciate your advice...

FYI: The hierarchy of my files in my bucket is: mybucket/(contents of build folder)..., I do not have build folder in my bucket, but I have all contents in there (css,js,static,the rest), but I think that should work right? In addition to that, the bucket was created by someone else before, and not owned by me, do you think that would cause any issue? Thanks a lot!

[KHBHH]

Hi @lidaof

So I checked my console, the following shows:

[lidaof]

Hi @KHBHH, I think what you did are right. I pasted my settings below. I don't think you need CORS settings for static web hosting, you do need CORS for the track hosting folder. Can you double-check the settings and we can troubleshoot further?

[KHBHH]

Hi @lidaof ,

I have the bucket policy just as you have now, and the following is the objects of my bucket.. (which are basically the contents of build folder): (You can ignore the folders (references and rna-seq)

And I am still getting a blank page!

[lidaof]

Hi @KHBHH can you try this https://www.npmjs.com/package/http-server and servers the build folder to see if you can see the page?

[KHBHH]

Hi @lidaof, when I am inside frontend folder: I did npm install --global http-server

and then:

When I do: http-server ./

And visit localhost (http://localhost:8080/) it gives me this:

Is this what you were asking for?

[KHBHH]

Hi @lidaof ,

And when I am in my build folder and I do the following: http-server ./

I get this blank page as below:

I just checked the console, it is the same bugs that showed when I tried to run the website from the S3 bucket..

[lidaof]

Hi @KHBHH can you zip the build folder and send it to me at [email protected]? thanks!

[KHBHH]

Hi @lidaof,

I just sent my build folder zipped, I appreciate the support again, thanks!