Image Image Image Image Image
Scroll to Top

To Top

Johannes' Blog

19

Aug
2019

inGeneral

vonJohannes Hoppe

[email protected]

On 19, Aug 2019 | inGeneral | vonJohannes Hoppe

I’m very excited to announce [email protected]
You can now easily deploy your Angular app to GitHub pages. Here is a quick start, that shows how you can publish you app within minutes.

Quick Start

This quick start assumes that you are starting from scratch. If you already have an existing Angular project on GitHub, skip step 1 and 2.

  1. Install the next version of the Angular CLI (v8.3.0-next.0 or greater) globally and create a new Angular project.

    npm install -g @angular/[email protected]
    ng new your-angular-project --defaults
    cd your-angular-project
  2. By default the Angular CLI initializes a Git repository for you. To add a new remote for GitHub, use the git remote add command:

    git remote add origin https://USERNAME.github.io/REPOSITORYNAME.git
  3. Add angular-cli-ghpages to your project.

    ng add angular-cli-ghpages
  4. Deploy your project to GitHub pages with all default settings. Your project will be automatically built in production mode.

    ng deploy

    Which is the same as:

    ng run your-angular-project:deploy

  5. That's it! Your project should be available at https://USERNAME.github.io/REPOSITORYNAME.

Learn more at:
https://github.com/angular-schule/angular-cli-ghpages

07

Aug
2019

inAngular2

vonJohannes Hoppe

Kendo UI for Angular: Window-Dialog

On 07, Aug 2019 | inAngular2 | vonJohannes Hoppe

kendo-window-dialog2

Hello fellow Angular Kendoka! I made the Kendo Window-Dialog Component for you. It’s a modal dialog that you can move and resize.

Technically it’s is a wrapper around the Kendo Window (can be moved/resized, but has no overlay), which borrows some functionality from the Kendo Dialog (has an overlay, but cannot be moved/resized):

Features:

  • you can resize and move it
  • it has an overlay
  • remains centered on window scroll / resize
  • it closes on ESC key

Have fun with it:
https://stackblitz.com/edit/kendo-angular-window-dialog

16

Jun
2019

inAngular2
Highlights

vonJohannes Hoppe

Hallo #ngHeidelberg

On 16, Jun 2019 | inAngular2, Highlights | vonJohannes Hoppe

ngHeidelberg
Seit vielen Jahren unterstütze ich die lokale Community in der Rhein-Neckar-Region. Mein Engagement für die .NET User Group habe ich in der jüngsten Zeit herunter gefahren um nun 100% für die Angular Community geben zu können.

angular_heidelberg_logo

Angular Heidelberg ist das Angular Meetup für die Metropolregion Rhein-Neckar.
Das erste Treffen war am Juli 2018. Das fünfte Treffen wird im Juni 2019 sein.

In diesem Meetup dreht sich alles um das Angular Framework (version 2+) von Google und alle damit verbundenen Technologien. Themen wie TypeScript, Reactive Programming und Hybrid Apps stehen bei uns auf der Tagesordnung. Die Hauptsprache dieser Meetup Gruppe ist englisch.

Mehr auf: angular-heidelberg.de

01

Mai
2019

inAngular2

vonJohannes Hoppe

Blog der Angular.Schule

On 01, Mai 2019 | inAngular2 | vonJohannes Hoppe

banner-angular-schuleEs gibt viele weitere Artikel im neuen Blog!

Zugegeben, hier ist es etwas still geworden. Das liegt daran, dass ich nun hauptsächlich auf der Website der Angular.Schule publiziere. Dort gibt es viele weitere Artikel von mir rund um das Framework Angular.

Besuche den Blog der Angular.Schule unter //angular.schule/blog

08

Jun
2018

inGeneral

vonJohannes Hoppe

Quickpost: How to add SSL/TLS to WordPress via Cloudflare ☁️ for free

On 08, Jun 2018 | inGeneral | vonJohannes Hoppe

This is not a nice article as usually. But it should help! :-)

  1. wp-config.php change WP_HOME and WP_SITEURL to https://yourdomain. This example uses haushoppe-its.de
  2. Get an account at cloudflare. Add your domain to your account. The free plan is fine. Follow the instructions.
  3. Cloudflare wants you to change your nameserver. Cloudflare is super-cool, you won't regret this. Cloudflare wants elsa.ns.cloudflare.com and ken.ns.cloudflare.com.
  4. Pimp the DNS settings. If you want A records (no “www”), it looks like this. Take care about the proxy setting (orange cloud). You want this for your website, but you definitely do NOT want to break your database.

Tags | , , ,

22

Mrz
2018

inNode.js

vonJohannes Hoppe

html2pdf converter

On 22, Mrz 2018 | inNode.js | vonJohannes Hoppe

screenshot

I made a super simple online service to convert websites to PDF files. It uses nodejs/express and a headless chrome (puppeteer) which makes it very bulletproof and easy to install. No struggling around with PhantomJS (no X11 or Xvfb) binaries.
It simply works and does the job. That’s all. 😀

https://github.com/JohannesHoppe/puppeteer-html2pdf

16

Mrz
2018

inNoSQL

vonJohannes Hoppe

NoSQL Vorlesung 2018

On 16, Mrz 2018 | inNoSQL | vonJohannes Hoppe

dhbw_mosbach_2014
„NoSQL“ steht für „Not only SQL“ und bezeichnet jene Datenbanken, die ohne relationale Datenbanktabellen auskommen. Im Folgenden finden Sie eine Reihe von Unterlagen und Downloads für meine Vorlesung bei der Dualen Hochschule Baden-Württemberg Mosbach.

Weiterlesen…

01

Sep
2017

inAngular2

vonJohannes Hoppe

Aktuelle Workshops

On 01, Sep 2017 | inAngular2 | vonJohannes Hoppe

tagesworkshopWir sehen uns beim Angular-Workshop auf
der ADC – Advanced Developers Conference (20.09.2017, Köln) oder
der WDC – Web Developer Conference (09.10.2017, München)

Mehr unter: https://angular.schule/blog/2017-09-termine
Rabatt-Code nicht vergessen!

01

Jul
2017

inAngular2

vonJohannes Hoppe

Die Angular.Schule

On 01, Jul 2017 | inAngular2 | vonJohannes Hoppe

banner-angular-schuleMachen Sie sich und Ihr Team fit für das Web!

Die Angular-Buchautoren Ferdinand Malcher und Johannes Hoppe bieten professionelle Angular-Workshops – direkt bei Ihnen im Unternehmen oder in offenen Workshops. Nach Abschluss unserer Schulung sind Sie in der Lage, professionelle Apps mit Angular zu entwickeln.

Besuchen Sie die Angular.Schule unter //angular.schule

12

Okt
2016

inAngular2

vonJohannes Hoppe

Angular 2: How to use date input controls with Angular Forms

On 12, Okt 2016 | inAngular2 | vonJohannes Hoppe

screenshot

The problem

Working with forms is pretty easy in Angular 2. You just need to decide between Template-Driven and Reactive Forms and you are ready to start with some bindings and validation. The following code shows a two-way data binding with ngModel against a property of type string:

<input name="name" type="text" />

But there is one problem to tackle: models of type Date!
You might wonder, because HTML5 date input controls are not working as expected: