from Esslingen, Germany...

We are programmers from Esslingen and we are sharing our experience with:
July 26, 2018

Locally serving the build distribution of an Angular SPA

tl;dr Use Node Package local-web-server and its command ws with the spa flag like this: ws –spa index.html While developing an Angular based SPA usually you will use the Angular CLI as build too. The CLI has an integrated development server which is able to handle client-side routing. So whenever a reload happens and you’re on a route, the browser and the application will stay on this route after the
Read more…


No Comments

Philipp Burgmer

Entwickler bei thecodecampus

July 18, 2018

Angular, Preserving Query Params and Google AdWords

… and how all this leads to an incorrect source of traffic in Google Analytics and incorrect conversion attribution.   The situation is as follows: On www.thecodecampus.de we run an Angular 6 page. We advertise our product with Google AdWords. If a visitor comes via Google AdWords, the URL is appended with a glcid and several campaign parameters as query params. This data is important for tracking, as Google Analytics determines
Read more…


No Comments

Can Kattwinkel

Entwickler bei thecodecampus

Use Git Bash, Cmder or ConEmu as default terminal in IntelliJ IDEA on Microsoft Windows

This post will show you how to easily set the default Terminal to a Unix/bash like terminal in IntelliJ IDEA on Windows. As the Windows CMD.EXE is quite limited in it’s functionality (and usability) you might already be using some UNIX-like terminal emulator like Git Bash (which comes with Git for Windows, so you might already have it installed), Cmder or ConEmu. Open IntelliJ Settungs using File -> Settings and
Read more…


No Comments

Christoph Strauss

Entwickler bei thecodecampus

March 5, 2018

Throwing Errors in Npm Build Script

From time to time you may want to throw an error from within an npm build script. This should be done in such a way that the complete execution of the script is recognized as faulty. So that for example, a build server recognizes that a script did not run successfully. You only need to output the correct exit code in order to achieve this behaviour. Ideally, the user should
Read more…


No Comments

Can Kattwinkel

Entwickler bei thecodecampus

The ‘this’ context of type ‘void’ is not assignable to method’s ‘this’ of type ‘Observable<{}>‘.

If you are experiencing this error – usually something with your RxJS imports is wrong. So you should go through them manually or simply delete all imports from RxJS in the corresponding file and let the IDE generate them again. Something broken could look like this:

Better working might be:

What is happening? RxJS switched from monkey patching to the import of pipeable operators (also known as lettable operators).
Read more…


No Comments

Can Kattwinkel

Entwickler bei thecodecampus

February 23, 2018

Creating a CORS Middleware in nest.js

Nest.js is a great framework for writing REST-API’s using Node.js. It features Angular’s dependency injection, an complete TypeScript integration and helps you with structuring your code. A common issue when working with REST-API’s is Cross-Origin-Request-Sharing (CORS), which keeps your Angular client from requesting resources which are located on another domain. Let’s pretend, for instance your Angular client is being served from example.com and your server is available on server.com. In
Read more…


2 Comments

Christoph Strauss

Entwickler bei thecodecampus

February 12, 2018

Angular Universal XMLHttpRequest is not defined with HttpClient

I’ve recently had an extremely weird application behavior. The application is this server side rendered Angular page.  I discovered that the router outlet for this page was empty on the SSR result. I hadn’t noticed before since the site was bootstrapping really fast even without SSR. A quick look into Sentry – which holds our server logs  – revealed the cause. I got the following error: XMLHttpRequest is not defined This
Read more…


No Comments

Can Kattwinkel

Entwickler bei thecodecampus

February 9, 2018

Angular CLI: Add Sitemap.xml and Robots.txt File

As Developer you may get the task to add a Sitemap and a robot.txt to your Angular CLI Project, this is quite easy. Copy the files next to the favicon.ico  into the /src  folder of your Angular project.

Now open up the  .angular-cli.json  in the projects root folder and add the two files under assets , as follows:

  Restart your Angular build and the files should be served directly.
Read more…


2 Comments

Frederik von Berg

Entwickler bei thecodecampus

February 7, 2018

Angular Universal Handle 404 and Set Status Codes

When working with Angular Universal we can implement a full-fledged server. Of course, this does not only include for example to display a 404 page for incorrect urls but also setting the correct status code. So that for example search engines and crawlers in general can process the result correctly. Angular itself allows us to easily create a 404 page via the router package. However, this is to be regarded
Read more…


12 Comments

Can Kattwinkel

Entwickler bei thecodecampus

November 22, 2017

Angular Full Height App Component

Since I have seen a lot of very different approaches to build up an Angular application correctly regarding the CSS positioning, I would like to talk about the different solutions in a short article. Basically it has to be said that our application is usually included in an HTML document as app-root. An index.html created with the Angular CLI looks like this:

The app-root element refers to our AppComponent. Here we
Read more…


2 Comments

Can Kattwinkel

Entwickler bei thecodecampus