How to debug javascript in Eclipse served by a Django Server - javascript

Let me 1st explain my setup.
I am trying to build a website using Django as backend framework and with Twitter bootstrap as frontend framework (using the django frontend)
My env is CentOS 5.9 with Eclipse Kepler with Pydev, JSDT, WDT plugins (Python 2.7, Django 1.4+).
I am able to debug Django Python files (views.py) using --noreload (argument to manage.py) using the pydev perspective.
But how do I debug the frontend Javascript from Eclipse (I know I can use Chrome/Firefox tools, but I would like to debug and use JS autocomplete feature of Eclipse) that is served from a Django server? To make things simple, I am running the Django manage.py from a terminal (unless someone can tell me how to debug Django and JS at same time from Eclipse?)
I know I can debug static pages using chrome dev tool with Eclipse, but I am looking for way to debug pages (JS, CSS) served by Django.
Thanks for the help :) Let me know if you think there is a better way to debug JS.

Start a server on localhost
open a browser and navigate to your local server.
Use the built-in debugging capabilities of your browser.

Related

How to disable the server side of Nuxt?

I've made a new project in NuxtJs.
When I run npm run dev, however, it shows the following in my terminal:
√ Client
Compiled successfully in 7.88s
√ Server
Compiled successfully in 5.14s
Does this mean that NuxtJs automatically boots a Front-end and a back-end? If so, how can I disable/delete this back-end. A back-end will be made apart from my front-end, actually.
Nuxt is not a backend in a sense that it will replace Express, Laravel, Ruby on Rails or alike. It's a meta framework with various capabilities like SSR (Server Side Rendering), SSG (Static Site Generation), SPA (Single Page App) and some other in between if you're using Nuxt3.
You could disable the "server" part of Nuxt by setting ssr: false but you will lose quite some performance overall. It will mainly be an improved version of Vue (understand from a Developer eXperience part) but will not be as fast as it's supposed to be for your end users.
Consider keeping Nuxt as an SSG (ssr: true + target: 'static') alongside your actual "API backend".
PS: pretty much all JS meta frameworks work in this kind of way. Mainly because doing things on the server is faster/safer than doing that on your user's crappy laptop from 2000 (SPA's only basically) via pure client side.

How to include JavaScript sources in startup.cs of AspNetCore?

Is there an easy way to reference JS sources from a JS project that has "JSProj/src/main.js" , "JSProj/package.json" to run at "AspNetCoreProj/startup.cs"?
So that when the asp is run, my controller from "AspNetCoreProj/Controllers/MyController.cs" binds to (launchSettings.json) "applicationUrl": "http://localhost:44709", "sslPort": 46367 AND the front-end JS App is run at, let's say, http://localhost:8080 at the same time?
So that I only need to run the asp app, not the two applications, including AspNetCoreProj and JSProj, separately.
I already installed node.js and run the JS app server using npm run build / npm run serve / yarn serve from command line, but I do not understand the concept of deploying the JavaScript sources (especially when it uses some framework like Angular) along with my ASP project, it just doesn't compile and/or run (that is to say: I'm very new to JS and its frameworks concept).
Do I really need to run a separate JS server for front-end or I can easily reference a JS project in a let's say, index.html / index.cshtml page?
edit: I need to know how to bind an asp.net core project with an angular (react.js / vue.js) project.
When a JS framework runs using serve, it will run on its own in-memory server like in angular a node.js server with its own port ,one option like you mentioned is to run manually both server and js framework, another option in ASP.NET Core is to "tell" the server to run the JS framework.
In any of this options (while developing) the JS framework will run from its own local server (in Angular a node.js) it is just that in second option the ASP.NET Core will do the serve for you, for this to happened you need to "tell" the asp core application what to do on startup, in order to do that in you need to configure startup.cs.
I think the best way is to open a new Angular project from template project in Visual Studio you can see all the settings that are needed, I will just mention that there are settings in 3 places: in startup.cs in ConfigureServices() and in Configure() as well as right click on the ASP.NET Core project => edit project there are some commands how to handle the Angular app when compiling as well some publish commands
In fact the problem was that an MVC (Web Controller app) project cannot be used to run JavaScript, It needs to be an "Angular" asp.net core web app or an asp.net core web app that's configured to use a single-page application (SPA) in startup.cs.

Difference between Eclipse IDE for JavaScript and Web Developers and for Java EE

The question is, Eclipse IDE for JavaScript and Web Developers and Eclipse IDE for Java EE Developers, are both different IDEs, right? Assuming that, i can use the tools at Eclipse IDE for JavaScript and Web Developers like a eclipse java EE perspective? If not, what tools i can use to write javascript at Java EE IDE?
Thanks in Advance.
I really always hate to see folks being snippy in their answers, I apologize for the answers you got so far.
The core differences are:
Java:
The essential tools for any Java developer, including a Java IDE, a Git client, XML Editor, Mylyn, Maven and Gradle integration
Web/JavaScript:
The essential tools for any JavaScript developer, including JavaScript, TypeScript, HTML, CSS, XML, Yaml, Markdown... languages support; Kubernetes, Angular and React frameworks support; Node.js debugger; Git client; Mylyn task management; integrated terminal and remote filesystem explorer; Web and application server management.
At the end of the day its all about which packages come pre-installed. You can choose to start with one and then add the packages you want from the other. To see which specific pages are installed with either go here:
Java: https://www.eclipse.org/downloads/packages/release/2019-09/r/eclipse-ide-java-developers
Web/JavaScript: https://www.eclipse.org/downloads/packages/release/2019-09/r/eclipse-ide-web-and-javascript-developers-includes-incubating-components
As the Eclipse site clearly shows, the different versions contain different modules; in this case one has modules for JS and Web development, the other for Java EE development. Just download the version that has all the modules.

Inject JS into a live site from localhost

I'm working with Monetate, a testing tool which injects JS into our clients sites once the targeted page has loaded. Although Monetate is great for tests it is not good for developing and there is no community for it. I'm looking for a way to have a dev setup (express server, gulp task runner, sass etc) and to dynamically inject the JS and CSS files into our clients sites, simulating Monetate. I've been trying browser-sync but I can't seem to inject files from my local server into a live site. Any ideas would be most welcome!

Debug the javascript part of Django project using Webstorm

How can you get in the debug mode in webstorm to debug the frontend (implemented with javascript) in a Django project. I managed to import the js folder of my project but it's not possible to run and debug it through WebStorm, so for now I just run it through Eclipse and use the browser debugger so far. Any recommendations?
Should be possible via JavaScript Debug run configuration: you need to specify the URL of your start page (like 'http://127.0.0.1:8000/mysite/index.html')
as 'URL to open' and set remote URL mappings accordingly (http://confluence.jetbrains.com/display/WI/Starting+a+JavaScript+debug+session#StartingaJavaScriptdebugsession-Startingadebugsessionwhenusingadifferentwebserver). Of course, you can't start Django server from WebStorm, but you can debug javascript served by it...

Categories

Resources