Build a Website

Introduction

This tutorial provides step-by-step instructions for developing the GoGreen demo website using Bloomreach Content. The process is divided into two development iterations. Each iteration results in a functional website and expands your understanding of Bloomreach Content development tasks. By completing this tutorial, you will gain practical experience with the core development activities required to implement a website based on Bloomreach Content.

Prerequisites

Before you begin, ensure you meet the following requirements:

• Familiarity with basic web technologies such as HTML and CSS.
• Experience with templating languages like Freemarker or similar.
• The appropriate Java version installed:
  • Java 17 for brXM 16
  • Java 11 for brXM 15
  • Java 8 for brXM 14
• The required Maven version installed:
  • Maven 3.3.9+ for brXM 14
  • Maven 3.5.4+ for brXM 15
  • Maven 3.5.4+ for brXM 16
• Ability to create, build, and run a Bloomreach Content project.
• Familiarity with the Bloomreach Content User Interface.

Java development experience is not required. This tutorial uses standard components exclusively.

Using an IDE such as Eclipse or IntelliJ is recommended.

Approach

• Download the GoGreen web design from GitHub.
• Begin with the first task: Select Out-of-the-Box Features.
• You can download or clone the source code for each completed iteration from GitHub if you prefer to skip an iteration. However, following the full tutorial is recommended if you are new to Bloomreach Content.
• If you encounter issues, refer to the troubleshooting page or ask questions in the developer forum.

Iteration	1. Configure Out-of-the-Box Features	2. Develop New Features
Scope	Select and configure the Banner, News, and Search features provided out-of-the-box. Apply the GoGreen web design to these features.	Customize the page layout and implement a new Products feature using standard components.
Tasks	1. Select Out-of-the-Box Features 2. Configure Image Variants 3. Add Static Resources 4. Base Page Configuration 5. Configure Home Page 6. Configure News Overview 7. Configure News Detail 8. Configure About Page 9. Configure Navigation Menu 10. Configure Search 11. Add Related News	1. Two Columns Page Configuration 2. Secondary Navigation Menu 3. Product Document Type 4. Products Overview Page 5. Featured Products 6. News Faceted Navigation
Code on Github	brXM 14: https://github.com/bloomreach/website-tutorial/tree/iteration-1-14.7.7 brXM 15: https://github.com/bloomreach/website-tutorial/tree/iteration-1-15.1.0 brXM 16: https://github.com/bloomreach/website-tutorial/tree/iteration-1-16.0.0	brXM 14: https://github.com/bloomreach/website-tutorial/tree/iteration-2-14.7.7 brXM 15: https://github.com/bloomreach/website-tutorial/tree/iteration-2-15.1.0 brXM 16: https://github.com/bloomreach/website-tutorial/tree/iteration-2-16.0.0

Get Started

Begin with the first iteration.

Note: This tutorial focuses on feature development for a Bloomreach Content-based website. In practice, delivering such features also involves collaboration, version control, quality control, release management, and deployment strategies. These topics are outside the scope of this tutorial. For comprehensive training on these areas, see the Bloomreach training program.

The GoGreen web design uses the Kanzi Bootstrap theme under its Extended License. If you use this theme for purposes other than the Developer Trail, you must obtain your own license.