Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial

No-Code Build & Launch an App in 30 Minutes with Cursor

Joshua Richardson
Joshua Richardson
3,621 Points
Posted by Joshua Richardson
Joshua Richardson
3,621 Points

How do I open the js view in its own window (like the instructor)?

Oh my goodness, this has been so very frustrating. I've run the steps to:

▲ Next.js 16.0.7 (Turbopack)

and it creates a .js (??) UI. But from there I can't move the UI/window to see anything. I've rewatched the vid and used chatGPT for help multiple tries but haven't gotten past this (if that's informative any). I'm only 2 minutes into the lesson, I think. LOL

1 Answer

Daniel Montgomery
seal-mask
STAFF
.a{fill-rule:evenodd;}techdegree seal-36
Daniel Montgomery
Treehouse Staff
Daniel Montgomery
.a{fill-rule:evenodd;}techdegree seal-36
Daniel Montgomery
Treehouse Staff

Hey Joshua! I'm a little confused as to what you're trying to view. Is it the code for the .js file or a in-browser preview of the code being rendered?

If the agent generated a JavaScript file, you should be able to open it by selecting the file in the sidebar once you’re in the correct layout.

At the top of Cursor, you can switch between Agent Mode and Editor Mode using the icon with the two arrows pointing in different directions. The shortcut for this is Command + E. You can also open the Settings menu by clicking the cog in the top-right corner, and change the layout from there.

Once you’re in Editor Mode, you should see your full file and folder tree on the left. From there, select any file to open it in the center editor.

If you want to preview the rendered app, click the localhost:3000 link (or your network link). But before opening the preview, make sure to start your dev server by running:

npm run dev

If you do that first, the preview should load correctly in the browser. Let me know if anything still looks off!

Daniel Montgomery
seal-mask
.a{fill-rule:evenodd;}techdegree seal-36
Daniel Montgomery
Treehouse Staff
Daniel Montgomery
.a{fill-rule:evenodd;}techdegree seal-36
Daniel Montgomery
Treehouse Staff

Alternatively, you can simply ask cursor to "start" or "run" the project and it will run the command and/or help with any build errors that may occur when trying to start the project.