Matt RaibleMatt Raible is a writer with a passion for software. Connect with him on LinkedIn.

The Angular Mini-Book The Angular Mini-Book is a guide to getting started with Angular. You'll learn how to develop a bare-bones application, test it, and deploy it. Then you'll move on to adding Bootstrap, Angular Material, continuous integration, and authentication.

Spring Boot is a popular framework for building REST APIs. You'll learn how to integrate Angular with Spring Boot and use security best practices like HTTPS and a content security policy.

For book updates, follow @angular_book on Twitter.

The JHipster Mini-Book The JHipster Mini-Book is a guide to getting started with hip technologies today: Angular, 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.
You searched this site for "css". 327 entries found.

You can also try this same search on Google.

Alternative web frameworks for AppFuse

I've was thinking about the AppFuse Roadmap for a bit today - and it hit me. The hardest part of supporting frameworks like WebWork and Tapestry is going to be replacing the Struts features I'm confortable with. For WebWork, it should be fairly easy to replace Tiles with SiteMesh, but for Tapestry - does a templating framework even exist? Other things that might be hard to implement in Tapestry are the DisplayTag (although Erik Hatcher did mention it's easy to implement in Tapestry) and Struts Menu. I imagine doing something like implementing a menu with CSS/JavaScript isn't too hard in Tapesty - but can it be configured from an XML file and a Velocity template? Implementing these components into WebWork should be easy since it supports JSP, but Tapesty is a whole different animal. I've also heard that JSF already has a grid component - and the struts-faces library should allow me to use Struts Menu easily with JSF.

I guess the good news in all of this is that I will discover if this stuff is possible or not - instead of just wondering. If you do happen to know the answers off the top of your head - please let me know. The real question is - after all of this - which framework will I choose as my favorite. Stick around and read about my journey into these other frameworks from the perspective of a hardcore Struts developer and enthusiast. I don't plan on trying to prove that Struts is better - I just want to find the beauty of these other frameworks and report if it's all hype or actually true.

Posted in Java at Jan 17 2004, 09:24:47 PM MST 5 Comments

DJUG Meeting: The Future is Swing

I attended the Denver JUG meeting tonight and definitely enjoyed myself. It helped that I got to see an old friend, but it was also a nice refresher on XSL-FO and a great overview on J2EE UI choices. The basic concepts meeting was on XSL-FO, which as far as I know, is mainly used for creating PDF documents from XML content. Apache's FOP is widely used for doing XSL-FO in Java.

So here's a question for you - if I want to produce PDF versions of my resume (in struts-resume), which technology should I use? I know it'd be fairly easy with XSL-FO, but what about JasperReports? I'd like an easy way for users to be able to upload new "templates" for the PDF version of their resume, so FO might be the way to go. In addition, I'd also like to implement the PDF-rendering technology that I'll likely use on a real-world project. Are there some good APIs to use?

I did some XSL-FO work a couple of years ago and it seemed pretty cool, but it required a lot of trial and error to get things looking right (as is the case with most XSL). My favorite tool at the time was RTF2FO, which allows you to create a Word document with the look you want, save it as an RTF, and then convert it to a FO (.fo) document. Pretty slick stuff - it looks like they have a free trial and it's only $50/machine. The project I used it on was only 3 weeks, so the trail version did me just fine.

The main presentation was delivered by David Curry, who seemed to be an expert on J2EE UI choices.

David Curry is Director of Systems Development for ADP/SIS, part of the ADP Brokerage Services Group. He and his team use J2EE with DHTML, XML and Swing to develop mission-critical desktop productivity applications for brokerage and bond trading firms.

The main thing that impressed me was that David has been developing the same application since 1992. The app started out as a PowerBuilder desktop app, and moved to an HTML app, then DHTML - and now they're moving to Swing. They recently chose Swing (with the help of JGoodies) over their DHTML interface because 1) Java Web Start makes it much easier to deploy and 2) it's much more responsive for users on dial-up connections. David mentioned that it's a good idea to break your app into many separate jars so users don't need to update the entire app for new releases (a.k.a. JNLP Versioning).

I've often argued that you can make a webapp do almost anything a desktop app can do, but I can't argue with the bandwidth thing. It does take a long time to download a webapp that has a lot of JavaScript, CSS and images that make it rich. David mentioned that Gartner expects HTML interfaces to subside in the coming years, and for rich UIs (like Swing and SWT) to become more the norm. In one sense, I hope they don't - the only reason I'm in this industry is because of my HTML/CSS/JavaScript skills. It's all I know. Sure, I could probably learn Swing, and I might even like it, but I'd rather not. Learning Spring, WebWork and Tapestry sounds like more fun. Of course, if they can support a Swing UI, then I've lost nothing by learning them. I know WebWork does, but what about Tapestry? Is it view-technology-agnostic?

On the other hand, Swing does have some advantages:

  • There aren't as many choices. Desktop apps are desktop apps, they should look like them. A lot of webapp developers (including myself) can get caught up in making a webapp look like a great website. The web offers so many more choices for look-n-feel that it's hard to decide which is right. I spend more time tweaking UI code (JavaScript and CSS) than doing anything else.
  • Java Developers can develop the UI. In my experience, I have a rare set of skills - a strong HTML/CSS/JavaScript background, and a firm grasp of Java. The industry rumor is that there's HTML developers and Java Developers, but they're rarely the same person. David mentioned that there team is nicely consolidated to 6 developers - and everyone knows how to program in all layers. This sounds like smart management to me, moreso than Swing makes your team more efficient.

The other side of the coin is that Swing will never replace many webapps. For instance, it could never replace Roller. Why would readers want to download a Java app to read this site. However, since most of you probably use client-side aggregators and client-side editors, maybe the shift to desktop apps has already started...

Posted in Java at Jan 14 2004, 10:09:17 PM MST 6 Comments

Sunken/Highlighted Input Fields with CSS

One thing I really like about TheServerSide's new look is the sunken input boxes (that light up on focus) in the top right corner. I noticed that Macromedia does this on a lot of their form's too. It's good stuff. Here's how easy it is to add this "feature".

In your stylesheet, add the following class definitions:

/* for cool looking "sunken" input boxes, from www.theserverside.com */
form#searchForm input {
    padding-left: 4px;
    margin: 1px 1px 1px 1px;
    border: 1px solid black;
    color: #777;
    background-image: url(../images/input_white.gif);
}

form#searchForm input.focus {
    margin: 0px 0px 0px 0px;
    border-bottom: #ffdead solid 2px;
    border-right: #ffdead solid 2px;
    border-left: #c07300 solid 2px;
    border-top:  #c07300 solid 2px;
    color: #000000;
}

Of course, restricting these classes to one form (as I've done with form id="searchForm") is optional. Then in your form's input fields, add: add a couple of onfocus and onblur event handlers:

onfocus="this.className='focus'" onblur="this.className=''"

You'll also need to grab the background image and put it on your site. If you're adding this to a form in your webapp, it might be easier to add all the event handlers with JavaScript:

var inputs = document.getElementsByTagName("input");
for (i=0; i < inputs.length; i++) {
    inputs[i].onfocus=function() {this.className='focus'};
    inputs[i].onblur=function() {this.className=''};
}

Thanks to the guys at TheServerSide for showing me how to do this - I dig it.

Posted in The Web at Jan 14 2004, 08:35:50 AM MST 11 Comments

Macromedia's Flex

I learned about Macromedia's Flex from the JavaLobby Newsletter this morning.

In essence, Flex is a presentation server that sits on top of a standard Java servlet container like Tomcat and provides the ability to use the Flash player and an updated scripting language to manage the client-side user interface of a web application. The Flex Runtime Services provide management of server-side security, connections to data sources, and so forth. The Flex Class Library provides support for a full set of server-side flash components that can be accessed via an XML markup language currently called "MXML" (which is going to change before the product release.) MXML contains the tags for the widgets in the Flex Class Library and allows you to express rich user interfaces succinctly.

I've always liked Flash, but I'm also a sucker for eye candy and cool-looking UIs. If Macromedia could make it possible to create flash files with a markup scripting language, like I do HTML/JavaScript for JSPs - I think they'll get a winner. If we're forced to use IDEs and other tools to drag and drop components - I won't bite. I'm too used to typing vs. point and clicking. I don't use Dreamweaver for HTML - why would I start now?

However, I do have a friend who is an awesome Flash Animator - it'd be cool to hook up with him someday to create rich web UIs. Only problem is - I think it'll be tough to find a client that prefers a flash interface over an HTML-based interface.

What would be awesome is if I could use a RenderKit from JSF to create a Flash UI. The ability to write standard HTML/CSS and have it generate a Flash UI that could do everything like a desktop app - mmmmm, sounds sweeeeettt.

Update: The Flex JSP Tag Library might be just what I was looking for. I also found an article on Providing a Flex Front-End to your Struts Applications. In my opinion, the one reason that Flex won't work is that it will cost money - all other J2EE View technologies are free. Cheap is good though - it might work if it's a mere 50 bucks.

Posted in Java at Jan 14 2004, 07:08:09 AM MST 5 Comments

Good News from TheServerSide

I woke this morning and was doing my normal perusing of JavaBlogs and came across a couple of gems: Middlegen 2.0 VO was released and TheServerSide.com has a new UI. A couple of thoughts I had:

  • What the heck does VO stand for in the Middlegen Release message? Does this new release support Struts 1.1?
  • The new UI for TSS looks great, but did they intentionally not set a background color on the page (shows up gray on my screen)? I think they forgot to set a background-color, because the stylesheet doesn't have one defined. Do me a favor, if you're a web developer, change your default background color in your browser to something obnoxious (i.e. purple) so you don't make this same mistake. Granted, most browsers default to white, but this is a mistake that only rookies make.

Posted in Java at Jan 13 2004, 06:28:56 AM MST 6 Comments

The Verge Web Framework

After reading this post on the Server Side, I'd hate to be the guy who invented Verge. He's getting pounded like a rabbit during mating season!

Personally, I don't think there's anything wrong with another web framework. Competition is good. The funny thing is that I've never had a need to migrate away from Struts. I do admit that the IoC (Inversion of Control) in WebWork looks cool, but I don't have a need. After reading most of Rod Johnson's J2EE Design and Development, I do understand IoC (I didn't have a clue before), but I still don't see how I need it. I've never run into a problem with Struts that I couldn't solve. Maybe it helps that I've written my own app to make Struts development simpler.

Even though I do like Struts, and I do find it easy to develop with, I also plan on stuffing my head in a couple of books and learning all about Spring, Tapestry and WebWork. Why? Mainly because I'm a fool and I can't be happy just sitting on the couch and watching TV (which would probably help my blood pressure and make my family happier). I'm a fool because I'd rather learn than relax. Back to the point - why do I want to learn these "big 3?" To be honest, it's primarily because some big names (and folks I'd consider friends) are saying they're cool and they'll make my job easier. If only I wasn't so easily influenced...

What I hate about all of this is that as soon as I decide to integrate Spring into AppFuse, it becomes more complicated. Yes, an XML BeanFactory file is more complicated than Interface i = new InterfaceImpl(), especially for newbies.

Furthermore, I'm willing to bet that I'll end up writing workarounds for issues I encounter in Tapestry and WebWork. I'll even put my money where my mouth is - if your framework doesn't require me to write any workarounds, I'll donate $100 to the project. Heck, if it really is that cool - I'll donate money regardless of workarounds.

The worst part is that there's really no reason to convert my Struts webapp to these newer, cooler frameworks. About the only good reason is so I can say "I know the XXX Framework." I doubt XXX Framework will make anything easier, but it certainly might make my webapp a whole lot cooler. wink

Posted in Java at Jan 12 2004, 03:57:49 PM MST 13 Comments

Roller Tips: Titles as Permalinks and Category Display

A few more tips for your Roller blog. You can edit your "_day" template to make your titles permalinks. I just added this feature to this site - try it now by clicking on this title for any post. To enable this feature, simply wrap your $entry.title element with a permalink URL. For example, change <b>$entry.title</b> to the following:

<a href="$baseURL/page/$userName?anchor=$entry.anchor" 
   style="font-style: bold; color: black">$entry.title</a>

Adjust the style as appropriate for your theme. The second tip is to add the ability for users to see the category you've posted to. Simply add the following under the $entry.title entry to display the category name in the top right corner of the post:

<span class="dateStamp" style="float: right">
    Category: $entry.category.name</span>

Again, the CSS for the span may depend on your theme. Lastly, if you click on a permalink for your blog and you're not routed to the specific entry you expect, for the love of God add the following before your $entry.title.

<a name="$entry.anchor" id="$entry.anchor"></a>

Posted in Roller at Dec 31 2003, 02:57:34 PM MST 7 Comments

Upgrading Hibernate, Struts and Display Tag

Last night, I upgraded a number of AppFuse dependencies: Hibernate → 2.1-rc, Struts Nightly from 2 weeks ago → Dec. 2nd and the Display Tag → 1.0 B2. The upgrades weren't as smooth as I'm used to, so I thought I'd share my experience to help y'all when you upgrade.

First of all, I found that Hibernate has ditched the Java Caching System (JCS) for their own, appropriately called Easy Hibernate Cache. This means you can forget about including jcs.jar in your webapp, ehcache.jar is now required. I upgraded from Hibernate 2.0.3.

Struts has done some trimming of their own - getting rid of their dependency on commons-lang. I use commons-lang.jar in AppFuse, so I had to dig into the contrib directory and grab it from there.

I had several issues with the displaytag when upgrading (from 0.8.5), but managed to figure them all out. First of all, the displaytag.tld in the jar's META-INF directory had the following in it's <taglib> declaration:

<taglib xmlns:html="http://www.w3.org/1999/xhtml">

This is obviously invalid, and I had to unjar, fix, and re-jar to get around this. I believe that this has been fixed on SF. I also found that this new version requires commons-collections 2.1. Struts must ship with an older version, so I simply replaces Struts' commons-collections with the one from the displaytag download.

The newer commons-collections is around 500 KB smaller - wierd, eh?

Lastly, I had to configure the ResponseOverrideFilter in my web.xml in order to get export functionality with Tiles. I had to tweek a LOT of CSS for this upgrade, but at least it's done now and hopefully I won't have to do it again for quite some time.

I also attempted to run AppFuse (with all these upgrades) in Tomcat 5.0.16 with no luck. With Hibernate 2.0.3, it was giving me an IllegalStateException when registering a new user. This process sets "Remember Me" cookies and redirects to the LoginServlet, which does a post to j_security_check and redirects to the originally requested page. Works fine in Tomcat 4.1.x, but not in 5.0.16. With Hibernate 2.1-rc1, I had to include jta.jar in $CATALINA_HOME/common/lib and now it still fails, but I get no errors whatsoever (those are always fun, aren't they). Also, still no luck with using J2EE 1.4.

Posted in Java at Dec 10 2003, 03:31:50 PM MST 1 Comment

[JSPWiki] Sweet Java/HTML/XML syntax coloring

I found a very nice plugin for JSPWiki this morning: the Java to HTML converter.

This tool converts Java source code (files and snipplets) to HTML, RTF, TeX and XHTML with syntax highlighting. It is Open source under the GPL.

I've found that it works for Java, XML and HTML. Here's a couple of examples (I've hooked it into Roller's JSPWiki support):

Java


/**
@return Returns the id.
* @hibernate.id column="id"
*  generator-class="native" unsaved-value="null"
*/

public Long getId() {
    return this.id;
}

HTML


<html>
  <head>
    <title>HTML Test</title>
  </head>
  <body></body>
</html>

XML



<?xml version="1.0"?>

<!DOCENGINE hibernate-mapping PUBLIC
    "-//Hibernate/Hibernate Mapping DTD 2.0//EN" 
    "http://hibernate.sourceforge.net/hibernate-mapping-2.0.dtd">

<hibernate-mapping>
    <class
        name="org.appfuse.persistence.User"
        table="app_user">

        <id
            name="id"
            column="id"
            type="java.lang.Long"
            unsaved-value="null"
        >
            <generator class="native">
            </generator>
        </id>

    </class>

</hibernate-mapping>

The one thing I don't like is that it centers the code using <center>, adding "center table {width: 100%}" to your stylesheet fixes the issue. I also tried to upgrade Roller's JSPWiki.jar to 2.1.86-alpha (to get XHTML support), but I was getting all kinds of stacktraces from OSCache and it just didn't work. Java2Html also has an Ant Task to convert Java source to HTML. Java2HTML has the same thing, but this new one supports different styles.

NOTE: The above syntax coloring produces invalid XHTML, so this site won't validate for awhile.

Posted in Java at Dec 05 2003, 01:02:08 PM MST 4 Comments

Display Tag: Static Headers - Revisited

I get a fair amount of hits on this site for my Display Tag: Static Headers post. When I originally wrote it, back in August, it didn't work in IE. So I asked the experts. I got a solution from that - split the tables and wrap the data table with a div that has style="height: 400px; overflow: auto". This works in IE, but since it's not easy to hack the HTML that the displaytag generates, this is an awkward solution.

Since my old demo disappeared when I updated struts-resume, I created a new one. This example shows how to do static headers in both IE and Mozilla - and the IE solution actually works in both. It's admittedly ugly, but it works. The major problem with this approach is getting the width of the top (header) cells to match up with the bottom (data) cells. I got them close using "th, td { width: 25%}" in my stylesheet, but that doesn't line them up exactly. If anyone knows of a better solution, let me know and I'll update the demo.

Posted in Java at Dec 04 2003, 01:51:05 PM MST 4 Comments