Matt RaibleMatt Raible is a Web Architecture Consultant specializing in open source frameworks.

The JHipster Mini-Book The JHipster Mini-Book is a guide to getting started with hip technologies today: AngularJS, Bootstrap, and Spring Boot. All of these frameworks are wrapped up in an easy-to-use project called JHipster.

This book shows you how to build an app with JHipster, and guides you through the plethora of tools, techniques and options you can use. Furthermore, it explains the UI and API building blocks so you understand the underpinnings of your great application.

For book updates, follow @jhipster-book on Twitter.

10+ YEARS


Over 10 years ago, I wrote my first blog post. Since then, I've authored books, had kids, traveled the world, found Trish and blogged about it all.

Happy Birthday Abbie!

We now have a teenager. Abbie turns 13 today and we're celebrating with smiles in the Raible household. Abbie is in 7th grade now. She's a straight-A student and still loves to pick on her little brother. She's old enough that she's picked up an after school job babysitting and often has more money in her back account than I do. Trish takes her horseback riding a couple times per week and she recently competed in her first horse show competition. You can tell by the photo below that she enjoyed the experience.

Abbie at her first competitive horse show

If you're a long-time reader, you might remember the day she was born. I started this blog only a few months before.

Happy Birthday Abbie! Most people are scared of their children's teenage years. We're not. You're an awesome human and we love your fun-loving spirit, your kindness and your ability to rile up Jack like no other. We can't wait to experience your teenage years with you and support you in whatever challenges you take on. 😋

Posted in General at Nov 05 2015, 06:37:43 AM MST Add a Comment

The JHipster Mini-Book: How We Did It and What's Next

The JHipster Mini-Book Last Friday, the JHipster Mini-Book was published on InfoQ. I wrote about this milestone on the book's blog. I'm pumped to see this release happen, and I'd like to give you a behind-the-scenes peak at how it went from idea to production.

The Idea
At the end of last year, I wrote down my goals for 2015:

  • 21 Point Fitness App
  • JHipster Mini Book (InfoQ)
  • Finish Bus
  • New House
  • Good Blood Pressure

My reason for wanting to write a JHipster Mini-Book was simple: I knew AngularJS, Bootstrap and Spring Boot quite well. I'd used them on several projects and I really liked how JHipster married them all together. I often ran into people that used these technologies, but hadn't heard of JHipster. I was hoping to make more people aware of the project and market my development skills at the same time.

[Read More]

Posted in Java at Nov 03 2015, 10:13:40 AM MST 7 Comments

RE: Customizing an Asciidoctor PDF so it looks like an InfoQ Mini-Book

Last week, I wrote about customizing an Asciidoctor PDF so it looks like an InfoQ Mini-Book. Shortly after writing that blog post, Dan Allen responded to my questions and showed me how to customize Asciidoctor's PDF generation. I ended up using both techniques he described: creating a custom theme and using Ruby to override methods. To recap, here are the changes I was hoping to make:

  1. The colophon is not aligned to the bottom of the page.
  2. The title page (first one after the cover) and colophon pages should be merged.
  3. The dedication and acknowledgement headers are not center-aligned and underlined like InfoQ's format.
  4. The main sections don't have whole-page delimiters.
  5. The table of contents comes right after the title page, rather than after the dedication and acknowledgement.

I'm happy to report that I was able to fix most these issues, except for the second one and last one. There is a pull request to allow changing the location of the table of contents, but I was unable to make it work. I spent a good hour building the asciidoctor-pdf gem and trying to modify AsciidoctorJ to use it. In the end, I decided to mark this as a bug in the JHipster book and we'll fix it when Asciidoctor supports moving the table of contents.

To customize the output, I created an src/main/ruby/asciidoctor-pdf-extensions.rb file and added the following code to it:

require 'asciidoctor-pdf' unless defined? ::Asciidoctor::Pdf

module AsciidoctorPdfExtensions

  def layout_title_page doc
      # no title page
  end

  def layout_chapter_title node, title
    if node.id == "dedication" || node.id == "acknowledgements"
      layout_heading_custom title, align: :center
    elsif node.id.include? "mini-book" # colophon
      move_down 470
      layout_heading title, size: @theme.base_font_size
    elsif node.id.include? "jhipster" #chapters
      puts 'Processing ' + node.id + '...'
      move_down 120
      # set Akkurat font for all custom headings
      font 'Akkurat'
      layout_heading 'PART', align: :right, size: 120, color: [91, 54, 8, 13], style: :normal
      move_up 40

      part_number = "ONE"
      if node.id.include? "ui-components"
        part_number = "TWO"
      elsif node.id.include? "api"
        part_number = "THREE"
      end

      layout_heading part_number, align: :right, size: 120, color: [42, 1, 83, 1], style: :bold
      layout_heading title, align: :right, color: [42, 1, 83, 1], style: :normal, size: 30
      move_up 30
      start_new_page
    else
       # delegate to default implementation
       super
    end
  end

  def layout_heading_custom string, opts = {}
      move_down 100
      typeset_text string, calc_line_metrics((opts.delete :line_height) || @theme.heading_line_height), {
          inline_format: true
      }.merge(opts)
      move_up 5
      $i = 0
      underline = ''
      while $i < string.length do
          if string == 'Dedication'
            underline += '/////'
          else
            underline += '//////'
          end
          $i += 1
      end
      if string == 'Dedication'
          underline += '////'
      end
      typeset_text underline, calc_line_metrics((opts.delete :line_height) || @theme.heading_line_height), {
            inline_format: true, color: 'B0B0B0', size: 8, style: :italic
      }.merge(opts)
      move_down 20
  end

end

Asciidoctor::Pdf::Converter.prepend AsciidoctorPdfExtensions

Then I modified build.gradle to use this file.

asciidoctor {
    backends 'html5', 'pdf', 'epub3'
    attributes 'sourcedir': '../../../main/webapp',
            'source-highlighter': 'coderay',
            'imagesdir': './images',
             toc: 'left',
             icons: 'font',
             linkattrs: true,
             encoding: 'utf-8',
            'setanchors': true,
            'idprefix': '',
            'idseparator': '-',
            'docinfo1': 'true'
    requires file('src/main/ruby/asciidoctor-pdf-extensions.rb')
}

After getting this to work, we're very close to publishing the JHipster Mini-Book! Thanks to Dan for creating Asciidoctor and supporting this great open source project. It's been a pleasure to write with it and the editing process with Git and pull requests has been wonderful.

Update: The JHipster Mini-Book has been released!

Posted in Open Source at Oct 28 2015, 10:41:38 AM MDT Add a Comment

Customizing an Asciidoctor PDF so it looks like an InfoQ Mini-Book

The JHipster Mini-Book Earlier this month, I finished the rough draft of the JHipster Mini-Book. Since then, I've been working with editors to get it ready for production. I've also been working with InfoQ to try and make the generated PDF look like their current mini-books. I wrote the book using Asciidoctor and I'm using Gradle to generate HTML5, PDF and EPUB versions.

After doing some research on Asciidoctor PDF themes I created an issue in the asciidoctor-pdf project. My reason for was to see if it was possible to customize certain sections of the generated PDF. The main issues I've had in making the PDF look like an InfoQ mini-book are the following:

  1. The colophon is not aligned to the bottom of the page.
  2. The title page (first one after the cover) and colophon pages should be merged.
  3. The dedication and acknowledgement headers are not center-aligned and underlined like InfoQ's format.
  4. The main sections don't have whole-page delimiters.
  5. The table of contents comes right after the title page, rather than after the dedication and acknowledgement.

After thinking about this a bit more, I thought of a few possible workarounds.

  1. I could add a number of line breaks at the beginning of the page to push everything down to the bottom.
  2. We could delete the title page (with Preview on a Mac or another PDF editor).
  3. We could create new PDF pages that have InfoQ's headers and my content. Then, using a PDF editor, we could delete pages and put the new ones in their place.
  4. There might be a way to have no text in a section's title (so it doesn't show up at the top of a page) and do the same copy/paste of an InfoQ section-delimiting page (with large Part One text) before the section. The hard part here might be lining up the table of contents with page numbers.
  5. Move pages around in the PDF and renumber pages using a PDF editor.

Even if all these workarounds are possible, this will only work for the PDF. InfoQ has asked me to make similar header customizations for the EPUB/MOBI versions.

I looked at the PDF theming guide and it looks like many things are customizable, but they're global customizations, not per-section customizations. Dedication, Acknowledgement, Preface, and Chapter Titles all live on the same level (level 2). I believe it's possible to customize how they all look, but I haven't figured out how to change an individual title.

The only thing I can think of beyond these workarounds are 1) hiring someone to create a custom theme for InfoQ or 2) forking the project and trying to make customizations to the source code myself.

I haven't had any feedback from the Asciidoctor team, so I'm posting this here to try and reach a wider audience. If you've authored a book in Asciidoctor, did you customize the output to fit your publisher's desired format, or did you just take the out as-is and publish it?

Posted in Open Source at Oct 22 2015, 02:15:21 PM MDT 2 Comments

Angular Summit 2015

I was in Boston this week, speaking and attending the very first Angular Summit. I had the privilege of delivering the opening keynote on Monday. I spoke about the Art of Angular and used a slide deck similar to last time. I did update the presentation to show the astronomical growth of AngularJS in terms of candidate skills (on LinkedIn) and job opportunities (on Dice.com)1.

LinkedIn Skills Growth for JavaScript MVC Frameworks Dice.com Job Growth for JavaScript MVC Frameworks

I mentioned the recently announced good news for Angular 2:

  • We're enabling mixing of Angular 1 and Angular 2 in the same application.
  • You can mix Angular 1 and Angular 2 components in the same view.
  • Angular 1 and Angular 2 can inject services across frameworks.
  • Data binding works across frameworks.

In related news, Craig Doremus recently posted a state-geo-angular project that shows how you can develop an Angular 1.x application that will be easy to upgrade to Angular 2.x. Thanks Craig!

After my keynote, I attended Pratik Patel's session on High Performance JavaScript Web Apps. Pratik pointed out mobitest.akamai.com for testing an app's performance and seeing its blocking resources. He also mentioned speedgun.io (currently unavailable) for capturing performance numbers as part of a continuous integration process. Finally, he recommended Addy Somani's JavaScript Memory Management Masterclass.

My second presentation was about JHipster. Near the end of the presentation, I mentioned that I hope to finish the JHipster Book this month. Writing presentations for SpringOne 2GX and the Angular Summit occupied a lot of my free time in September. Now that it's October, I'll be dedicating my free time to finishing the book. In fact, I think I can finish the rough draft this week!

For the last session of the day, I attended John Lindquist's session on Angular 2 Components. John showed us how everything is a component in Angular 2. He also said "now is the time to learn ES6" and built an Angular 2 ToDo App using ES6 and a bit of TypeScript. You might recognize John's name; he's the founder of egghead.io, an excellent site for learning Angular with bite-sized videos.

Tuesday morning started with a Angular 2.0 keynote from Peter Pavlovich. I really enjoyed this session and received lots of good tips about getting ready for Angular 2. The tweet below from Ksenia Dmitrieva shows his advice.

My biggest takeaway was to start following John Papa's Angular Style Guide ASAP.

The first session I attended on Tuesday was Judd Flamm's Google Material Design & Angular. I'm using Material Design for Bootstrap on a side project, so I was interested in learning more about its inspiration. We learned that Google Design has everything you need to know about why Material Design exists. We also learned about Angular Material and spent most of the session looking at its components. Judd recommended Angular Material-Start for those looking to get started quickly with both frameworks. Judd was a very entertaining speaker; I highly recommend you attend one of his talks if you get the opportunity.

After being dazzled by Peter's knowledge of Angular 2 in Tuesday's keynote, I attended two more of his talks: one on Meteor and another on Aurelia. I've known about Meteor for a while, but have become more intrigued by it lately with its 1.2 release and Angular support. Meteor's command line tools that auto-inject CSS and JS demoed very well, as did it's installable features like a LESS support and Facebook authentication.

After hearing all the good things about Angular 2 from Peter, it was interesting to hear him downplay it in his Aurelia talk later that day. When he started showing code, it was pretty obvious that Aurelia is doing a great job of simplifying JavaScript MVC syntax for developers. You can develop components with almost half the code that Angular 2 requires, and it uses ES6, jspm and SystemJS. If you're developing JavaScript, learning these tools will help prepare you for the future. It's cool that Aurelia encourages learning things you should learn anyway.

Aurelia and Angular 2 are both still in Alpha, so I'm not sure it makes sense to use them on a project this year. However, I do think it's important to track them both. I especially think it's interesting that the founder of Aurelia, Rob Eisenberg, left the Angular Team in November 2014 and announced Aurelia in January 2015 (Hacker News thread). Peter mentioned several times that Aurelia wants to help developers write apps, while AngularJS is more tied to helping Google write apps.

There were around 400 people at Angular Summit, which I think is pretty good for a first-run conference. As with most No Fluff Just Stuff shows, it ran smoothly, had plenty of time between sessions and was filled with knowledgeable, entertaining speakers. It was fun doing my first keynote and I look forward to speaking again in November (at Devoxx) and December (at The Rich Web Experience).

1. I know Dice.com is probably not a great site, but it makes sense to use it since I've been tracking JavaScript MVC framework job stats on it since February 2014.

Posted in The Web at Oct 01 2015, 10:29:31 AM MDT Add a Comment

SpringOne 2GX 2015: My Presentations on Comparing Hot JavaScript Frameworks and NoXML

Last week, I had the pleasure of traveling to Washington, DC to speak at the annual SpringOne 2GX conference. I was pretty stressed for the last few weeks because I had to create two new presentations from scratch, and both had to be 90 minutes long. I was also hoping to finish the JHipster Book before the conference started. I was able to finish both presentations in the nick of time, but did not find the time to write the last chapter in the JHipster Book.

The first presentation was titled Comparing Hot JavaScript Frameworks: AngularJS, Ember.js and React.js. I started by revisiting the Comparing JVM Web Frameworks talk I did at vJUG last February. I explained how I think traditional web frameworks are no longer relevant in 2015, but I do believe server-side rendering is still very relevant. From there, I used Yevgeniy Brikman’s framework scorecard (from his Node.js vs. Play Framework presentation) to rank each framework by a number of different criteria. You can see the final results on slide 160. Since the scores were so close, I believe you could tweak some scores a bit (or add weights to the different criteria) and make any of the frameworks come out on top.

You can click through the presentation below, download it from my presentations page, or see it on SlideShare.

I started writing the second presentation a week before I had to deliver it. On Thursday, September 10th, I stayed up late, trying to figure out how to create a good presentation on NoXML and finish the last part of the JHipster Book. Then it came to me, I needed to parallelize and do them both at the same time. I decided to compare AppFuse (which is similar to a legacy Spring application with lots of XML) to JHipster (which hardly contains any XML).

I wrote a 10-page Google Doc on how I planned to do this, then went rafting and camping with my family for the weekend. I finished most of the presentation on Monday night, but then realized the presentation wouldn't be long enough to fill 90 minutes. So I hunkered down at midnight, created a new AppFuse application and removed a bunch of its XML. This took me until 3:30am, and I was able to accomplish the following tasks:

  • Spring XML to Java
  • Spring Security Configuration to Java
  • web.xml to WebApplicationInitializer
  • Spring MVC to Java
  • Migrated to Spring Boot
  • Maven to Groovy

I was pretty pumped when I completed my final goal: converting to Spring Boot and getting a test to pass. I made commits to an appfuse-noxml project on GitHub as I accomplished each step. You can see all the changes in the project's commit log. While I'd figured everything out, I still needed to complete the presentation. Luckily, I found time to do this the night before, the morning of, and in the final hour before I had to deliver the talk. You can imagine my relief when I was done delivering both talks.

You can click through the presentation below, download it from my presentations page, or view it on SlideShare.

While I didn't get to spend much time at the conference, I did have a lot of fun while I was there. I got to meet some new folks, reconnect with old friends, and enjoy beers and dinner with a smiling crew on Thursday night. The Broncos victory late that night was the icing on the cake. :)

Posted in Java at Sep 20 2015, 12:29:00 PM MDT Add a Comment

Minecraft Modding at Denver's Devoxx4Kids

Devoxx4Kids Denver: Minecraft Modding Last weekend, Denver's Devoxx4Kids gathered at Tuliva to learn about Modding Minecraft. Several kids (ages 7-15) were introduced to programming Java by the founder of Devoxx4Kids USA, Arun Gupta, and his son, Aditya.

They used Java 8, Eclipse, Minecraft Forge and to show you how to create mods that could give you potatoes, skeleton cows, and even launch into different dimensions. The skeleton war was a big hit too. We had a record turnout at this event, and the space was fabulous. The live broadcast from vJUG went very smoothly and Tuliva's large screen and sound served us well. It was pretty sweet when we got shout-outs from the vJUG crew too!

Thanks for the great space Tuliva! Watching Arun and Aditya on vJUG

Simon Maple wrote a great summary of the session that includes the video we watched, as well as an interview with Arun and Aditya. Take a look at Devoxx4Kid's Minecraft Modding Tutorial if you'd like to see what we learned.

We did run into a couple issues while trying to follow along. The first was that the virtual machines we were using wouldn't run the Minecraft client. The error we saw was:

org.lwjgl.LWJGLException: Pixel format not accelerated

We later learned from Arun that virtual machines were an issue and it's better to use Forge on a local machine. The second issue we ran into was when folks tried to build Forge from source, they got a 500 error when it tried to download http://export.mcpbot.bspk.rs/versions.json. We later learned that the firewall was blocking it.

Despite these issues, I believe the kids learned a lot by watching the vJUG broadcast. I spoke with some parents that got things working in the class, as well as a few that tried it when they got home. After the modding session, I showed the class how to create a Minecraft Server on AWS. I also did some research to see if you could automate the server creation. I quickly landed on Thomas Offermann's site and his tutorials:

Thomas created a couple GitHub projects: one to setup a Minecraft server on AWS, as well as a webapp that you can start/stop it with. I haven't tried either project yet, but I hope to soon.

Thanks to all the Denver kids and parents that joined us last weekend! The Tuliva facilities were spacious and comfortable. We owe them a big thanks for sponsoring Devoxx4Kids Denver! We hope to do another workshop this fall, possibly on Raspberry Pi.

Posted in Java at Aug 19 2015, 08:41:52 AM MDT Add a Comment

How do I become a programmer?

Yesterday, I received a message from a friend, asking about how to become a programmer. It's not the first time I've been asked this. In fact, this summer I've been asked by several friends how to get into the field. It seems that as people grow older, they see the lifestyle of working remotely and enjoying their job as an attractive thing to do. In yesterday's case, this friend is a mom that now has her days free because all her kids are in school. Here's what she wrote:

Now that my girls are both in school full day, I've been thinking about taking some programming classes. It's something I started to do while I was working at [ABC Company], but obviously didn't pursue once I quit to have kids. I'm thinking of getting my MIS in web development or specializing in designing apps if that's even a thing? Anyway, what languages would you recommend I concentrate on? JavaScript, Python? Lastly, is there a particular school you would recommend? I can't afford DU on my stay-at-home-mom salary, or even Regis which is where I started when I was getting tuition reimbursement. I was hoping I could do most of my education online while the kids are in school? Any advice or words of wisdom would be greatly appreciated!

Since this is a common question I see, I figured I'd publish my answers here, and get some advice from y'all too. Here's my response:

Python would definitely be good, as would JavaScript. JavaScript can be done on the client and server these days, so you could do that and be able to do front-end and backend development.

For programming specifically, I've heard these guys have a good JavaScript course: https://www.codecademy.com. Here's how to get started with Python in eight weeks: http://lifehacker.com/how-i-taught-myself-to-code-in-eight-weeks-511615189. And one of my favorites: http://programming-motherfucker.com/become.html.

I've taken a Scala course from Coursera, it was hard and intense, but I learned a lot. They have lots of courses and give you certifications you can put on your LinkedIn profile: https://www.coursera.org.

I've also recommended https://teamtreehouse.com to folks and https://www.khanacademy.org has always been good, even for kids.

Ultimately, the best way to learn to code is by doing. It's definitely good to study, learn and practice, but it'll probably won't sink in and become real knowledge until you're getting paid to do it. With the plethora of high-priced programmers out there, you can likely find a junior position, show a willingness to learn and come up to speed quickly. If you can couple that with a remote position, I think you'll really enjoy yourself.

Her response was interesting, as she thought she might need a CS degree to even get a programming job.

Coincidentally I looked over many of these coding sites yesterday but wasn't sure if I needed an accredited diploma. It sounds like it's more important that I just get some experience.

From my experience, a college degree matters, but not a CS degree. I told her people skills make programmers stand out and she's a witty person that certainly has those. What's your advice as a programmer? What would you tell people to do if they want to break into the field?

More importantly, if you're on the hiring side, what would it take for you to hire a 40-something person with no programming background? If they've been studying for six months and have really good people skills, would you hire them for a junior position?

Posted in Java at Aug 13 2015, 08:32:43 AM MDT 7 Comments

Setting up a Minecraft Server in the Cloud

Minecraft My 10-year-old son, Jack, is a huge fan of Minecraft. If you let him, he'd play all day, skipping meals and having a blast. It's most fun to hear him playing with his sister or his best friend. I'm amazed it's captured his attention for so long; well over two years. Both my kids loved it when Scott Davis taught a Devoxx4Kids Denver class on Server-side Minecraft programming.

We haven't had any Devoxx4Kids Denver workshops this year, but that's about to change. First of all, I'm happy to announce we're working with the Rocky Mountain Oracle Users Group to have a Day of Family Coding Fun at Elitch Gardens this Friday. There will be a workshop on Raspberry Pi and I'll be doing a demonstration on how to setup a Minecraft Server in the cloud. Next weekend, we'll be doing a more in-depth Minecraft Workshop at Devoxx4Kids Denver. If you'd like to join us please RSVP. Since having your own Minecraft Server is a fun thing for kids, and useful for parents, I figured I'd document how to do it here.

First of all, let me say that I'm standing on the shoulders of giants. When I first setup a Minecraft server, I used Ben Garton's Setting up a free Minecraft server in the cloud - part 1 as well as part 2 and 3. I also found Aaron Bell's How to run a Minecraft server on Amazon EC2 to be quite useful.

Without further ado, here's you how to setup a Minecraft Server on Amazon Web Services (AWS) in 2015!

[Read More]

Posted in Java at Aug 05 2015, 03:03:00 PM MDT 5 Comments

UberConf 2015: My Presentations on Apache Camel and Java Webapp Security

Last week I had the pleasure of speaking at UberConf 2015. My first talk was on Developing, Testing and Scaling with Apache Camel. This presentation contained an intro to Apache Camel and a recap of my experience using it at a client last year. You can click through the presentation below, download it from my presentations page, or view it on SlideShare.

My second presentation was about implementing Java Web Application Security with Java EE, Spring Security and Apache Shiro. I updated this presentation to use Java EE 7 and Jersey, as well as Spring Boot. I used Spring Boot to manage dependencies in all three projects, then showed the slick out-of-the-box security Spring Boot has (when you include the Spring Security on the classpath). For Apache Shiro, I configured its filter and required dependencies using Spring's JavaConfig. You can click through my security presentation below, download it from my presentations page, or view it on SlideShare.

One thing that didn't make it into the presentation was the super-helpful pull request from Rob Winch, Spring Security Lead. He showed me how you can use basic and form-based authentication in the same app, as well how to write tests with MockMvc and Spring Security's Testing support.

The next time I do this presentation (at the Rich Web Experience), I'd like to see if it's possible to use all-Java to configure the Java EE 7 example. I used web.xml in this example and the Servlet 3.0 Security Annotations might offer enough to get rid of it.

All the demos I did during the security presentation can be seen in my java-webapp-security-examples project on GitHub. There's branches for where I started (javaee-start, springsecurity-start and apacheshiro-start) as well as "complete" branches for where I finished. The complete examples should also be in-sync with the master branch.

If you have any questions about either presentation, please let me know.

Posted in Java at Jul 27 2015, 08:08:48 AM MDT Add a Comment