Quote API - localhost 4001 not starting

I’m working on the Quote API Express challenge project as part of the Web Development path: https://www.codecademy.com/practice/projects/quote-api

I’ve tried and tried, but I can’t seem to get the front-end to display on localhost 4001. My browser says “This site can’t be reached”

I’ve followed the instructions exactly, ie navigating to the folder where the project is, running npm install, and then node server.js. I’ve also tried running npm install express --save: https://expressjs.com/en/starter/installing.html

One warning that comes up for me when I run the npm commands is “WARN quote-api@1.0.0 No repository field” but I don’t think that would prevent my locahost from running

Just wondering if anyone else has had the same issue?

You are not alone. To work around the issues I moved outside of Codecademy to VSCode editor. By downloading the files and then starting and integrated terminal in VSCode I was able to copy the file path from VSCode into my browser and work directly out of VS code. Hope that helps.

You may be interested to know that after leaving the pc for a bit and returning I restarted my Codecademy session. For whatever reason the bash shell was suddenly working again. I was able to easily type in “node server.js” and wait and the system responded perfectly with “Server listening on port 4001.” from there inside the Codecademy sandbox environment I was able to use the refresh button at the bottom of the page in green which produced the blue background HTML document in the sandbox. I also downloaded the solution and “tested” it in the Codecademy editor. The project worked perfectly. Hence, I think there was either a problem on the Codecademy end the first time I tried and producing what seemed like the same results you were frustrated with but, after waiting for a few hours and returning the problem self resolved. I sure hope that is the same resolution for you.

Thanks for your reply @peacefulrick. What do you mean exactly that you copied the file path from VSCode into your browser?

I’ve tried again to get the server set up on my localhost 4001, but nothing happens. The steps I’ve taken are:

  • Navigate to the project folder containing server.js
  • In the built in terminal in VS Code, run npm install
  • Enter the command node server.js
1 Like

Right click on the HTML file in VS Code. There are menu items. Choose “copy path” and paste that to your chrome browser. Then you will see the blue page that was supposed to be seen in the Codecademy sandbox.

Warmly

peacefulrick

I can do that, but the page that opens in my browser is just a static page - it doesn’t have the functionality of returning the quotes :frowning_face:

Well that is a step closer. However, let’s take a step back. Terminate all editors. Clear your cache on chrome, and ensure all servers are terminated. Restart Chrome and Codecademy, and in the Codecademy exercise bash shell try once more to crank it up with “node server.js” if you see the response “Server listening on port 4001” you are in business. You should be able to refresh and see a working version on the sandbox provided by Codecademy.

Alternatively you must review the file path in your HTML to ensure the buttons are referencing the proper files. In your VS Code you are almost there but as you mentioned it’s static and therefore the file paths referred to in the HTML file may need adjustment. I’m looking to see if I can reproduce the issue and help. But this is about as far as my “newbie” coding assistance goes.
Hive Five… Good luck.

Note,
By trial and error, I noticed that running Codecademy in port 4001 WILL conflict with VS Code on the same port. At least that is the case for me on my Windows 10 system. So if you use VS Code change the poort to say 4000 instead of 4001 in your server.js file.

1 Like

callmej9
I was able to reproduce your problem in both the Codecademy and VSCode Environments.

Codecademy Environment
To Work in Codecademy’s environment. Follow my previous steps.

  1. closed all integrated terminals/Servers in both Codecademy (Bash) and VSCode (Integrated Terminal)
  2. Clear your browser cache.
  3. Restart Codecademy and in the terminal type “node server.js” and enter.
  4. Click the green refresh button at the bottom of the page. (You can also use the refresh arrow at the top left of the sandbox next to the address http://localhost:4001/.

Then, if you still cannot get the Codecademy sandbox working, try using VS Code instead with these instructions…

Visual Studio Code Alternative
Here is an alternative to copying the static page file path. Rather than right-click on the HTML file and copy and paste the path into a browser, as we discussed earlier… do this instead…

  1. Go directly to your browser and type “localhost:4000” in the URL field. (I used chrome browser)
  2. Be sure you also have changed the port in your server.js file (in Visual Studio Code) from 4001 to 4000
    By changing both browser URL and VS Code server.js file, you avoid any potential conflicts between Codecademy on PORT 4001 and VSCode now on PORT 4000. Hence, your VS Code server.js file should have the following code.
    “const PORT = process.env.PORT || 4000;” in VSCode.

If neither of these works, I’m happy to meet with you on Zoom to walk you through it.

I changed the port to 4000 instead of 4001 and this fixed it. The site is now working with all functionality on localhost:4000.

Thank you SO MUCH for all your help @peacefulrick - absolute legend!

1 Like