Простой пример

Создаем форму в XHTML (может быть окружено html), где дополнительные теги указывают, где и как будут располагаться наши элементы.

Самый главные тег f:view — определяет объект View. Внутри View мы располагаем компонент h:form. У каждого компонента имеется свой идентификатор (если мы не назначили его сами JSF сделает это за нас). В компоненте h:inputText имеется Value. У нас там UserBean — это обычный JavaBean. InputText и inputSecret одинаковые, но по разному отображают информацию, это достигается за счет Renderer. h:commandButton: все компоненты которые содержат префикс command генерируют событие Action. h:messages сделан для вывода сообщений loginForm.