How to include and use jQuery in Angular CLI project

Tested in angular version 7:

  1. install jquery:
    npm install jquery
    install jquery typescript intellisense:
    npm install @types/jquery
  2. edit the angular.json file in root folder:
    in the architect / build / scripts location, add this:

  3. To use jquery inside a component.ts add this import at the top:
    import $ from ‘jquery’;

    Example code to check for functionality:
    component html:

    component.ts:

    Click on the button should fade out and fade in the entire page.

Source: How to include and use jQuery in Angular CLI project

cors-proxy-server – npm

I wanted to try out some Angular code against a demo odata service, but when requesting data from another domain in a web browser (the angular context) you might get:

Access to XMLHttpRequest at ‘http://services.odata.org/V4/OData/OData.svc/Products?$format=json’ from origin ‘http://localhost:4200’ has been blocked by CORS policy: Response to preflight request doesn’t pass access control check: Redirect is not allowed for a preflight request.

To get around this problem you could use a node proxy like this one:

Source: cors-proxy-server – npm

Install and start it up. Now we can call the odata service by prepending the proxy url before the actual api endpoint like this:
http://localhost:9090/http://services.odata.org/V4/OData/OData.svc/Products

Notice the double http://

The entire CORS problem can be summarized like this:

The web browser will prevent javascript to get a response from the service at domain x if that server does not explicitly say its ok to respond the remote caller. In our case our source domain is ‘localhost’ and the services.odata.org haven’t added that as a valid domain to respond to according to the web browser.

More info regarding CORS here: https://developer.mozilla.org/en-US/docs/Web/HTTP/CORS

EPiServer Admin Import data – Fixing the Request timed out exception

If you are importing a big file of data into EPiServer through the admin import data feature, you might get this exception:

Exception Details: System.Web.HttpException: Request timed out.

ASP.NET has a timeout of 120 seconds by default, you can increase this setting for the admin section only using the following setting.

Add this directly under the location path admin / system.web element:

E.g. in web.config:

Source: https://support.microsoft.com/en-ca/help/925083/error-request-timed-out-when-you-try-to-upload-a-large-file-to-a-docum

Grayscale mode in Windows 10, distraction-free reading with f.lux

This new version of f.lux has a grayscale mode and new key to turn it on: Windows + End.

The big surprise is how distracting the icons on the top and bottom of your screen are. These icon colors are the kind of thing you see in candy stores and on fire alarms, but we have to ignore them just to get work done. Without those colors, your computer looks more like a magazine that can help you focus on reading or thinking—it feels different, like a sheet of paper.

Source: What’s new with f.lux

Nuget package handling – Using package.config instead of new PackageReference in csproj Visual Studio 2017

In Visual Studio 2017 and with .NET Core projects a new way of referencing nuget packages was introduced. Somehow during a .NET project upgrade one of the nuget packages were converted into a PackageReference (referenced in the csproj file and not from package.config). Below are the steps to convert such package reference back into plain old package.config behaviour:

In addition to removing the PackageReferences from the project file, I also had to remove the following files from the $ProjectDir\obj directory: Myproject.csproj.nuget.cache Myproject.csproj.nuget.g.props Myproject.csproj.nuget.g.targets project.assets.json

Source: How can I revert to referencing Nuget packages in packages.config after using Package References in a .NET Standard project? – Stack Overflow

Different js scripts for different ASP.NET core environments· jonhilton.net – Making sense of .NET

When you reference a .js framework or library from your ASP.NET application, it makes sense to use the development version when you’re working on your own machine.

Referencing the development versions brings more useful error messages and integration with the React Developer tools.

But, you wouldn’t want to use these in production for performance reasons.

When you run the site in production, you’d want to reference the minified production versions of the React scripts.

Source: Different js scripts for different ASP.NET core environments· jonhilton.net – Making sense of .NET