Developing a web application using ADF is fun, and the most interesting part is to work in an integrated development environment such as JDeveloper IDE. JDeveloper IDE imparts a declarative environment and supports an end-to-end development life cycle for an enterprise application using ADF. JDeveloper has been designed to interact efficiently with most of the technologies.
JDeveloper has undergone several phases of changes/versions, and it is now the prominent, most preferred IDE for developing web applications using Oracle technologies, especially ADF. The latest version of JDeveloper available in the market is 11gR2 with the release Version 11.1.2.3.0. The advantage of the JDeveloper 11gR2 release 11.1.2.3.0 is that it supports the development of mobile applications for iOS and Android mobile devices.
In this chapter, we will learn how to:
Install JDeveloper on Windows
Work with the IDE
Get familiar with the IDE components
JDeveloper 11gR2 is supported to run on the following operating systems:
Windows
Linux
Mac OS X
The recommended system requirements for Windows are as follows:
Operating system version: Windows 7 and Windows XP with service pack 3 on both 32-bit and 64-bit systems
Minimum system memory: 2 GB for 32-bit and 3 GB for 64-bit machines is desirable
Display settings: Minimum of 1024 x 768 resolution for ADF development
JDK requirement: Java 6.0 Update 24 and above
JDeveloper 11gR2 Studio Edition is free for development and is licensed under the OTN JDeveloper license agreement. JDeveloper 11gR2 (11.1.2.3.0) has a free runtime license for applications deployed to GlassFish using the ADF Essentials feature. Perform the following steps for downloading the installer:
On the OTN website (http://www.oracle.com/technetwork/developer-tools/jdev/downloads/index.html), click on the Downloads tab, read the terms, and accept the license agreement.
Select the Windows Install drop-down option for Studio Edition: 11.1.2.3.0 and click on the Download File button.
Accept the prompt to save
jdevstudio11123install.exeon your machine.
You have downloaded the installer from the OTN site to install the JDeveloper 11.1.2.3.0 Studio edition on Windows.
This installer is an executable that will run only on Windows. The installer and the installation procedure differ from platform to platform. You will have to download a Linux install for a Linux platform, and there is an option to download a generic, platform-independent installer for MAC. Refer to the following URL for more information on how to use a generic installer:
http://www.oracle.com/technetwork/developer-tools/jdev/documentation/index.html
Ok, now it's your turn to research more on the optional components that can be downloaded for JDeveloper 11gR2. There are other components that support adding more features for JDeveloper IDE.
Ask yourself the following questions and find the answers on the Downloads page:
We have different development teams to work with. What are the options to collaborate for increased productivity?
How can you find out more about the previous versions of JDeveloper before starting with 11gR2?
Can I install my ADF application on any other JEE servers?
Where can I see the ADF framework components in action?
I want to develop my own custom theme for the ADF components. Where can I find a user-friendly editor for customizing the components?
Let's perform the following steps to install the JDeveloper 11gR2 Studio Edition:
Double-click on the
jdevstudio11123install.exefile to launch the installer. The Oracle installer starts preparing for the installation, and a screen with a progress bar appears.Once the preparation is completed, a Welcome screen is displayed. Click on the Next button to proceed with the installation process.
The next screen will ask you to choose the middleware home directory for the installation. The Middleware Home Type section will have two options to choose from. One is Use an existing Middleware Home and the other one is Create a new Middleware Home.
Select Create a new Middleware Home and locate the directory where you want to install JDeveloper Studio and other additional components. The installers will display an error message if the path already exists. The directory that you specify here will be your middleware home, and a common practice is to refer to the directory as
MW_HOME.Click on the Next button to choose the installation type on the next screen.
On this screen, you will select how you want to install the product. You will see two options, namely Typical and Custom.
The Typical installation will install JDeveloper Studio, application development framework runtime, and WebLogic Server on your system
The Custom installation will allow you to choose the product and components to install
We will select the Typical option this time; it will install all the related components necessary to run the application.
The next screen will display the installation directories for different components. Following are the default directories:
For JDeveloper:
MW_HOME/jdeveloperFor WebLogic Server:
MW_HOME/wlserver_10.3
You can select the Discard Changes option at this point of time to revert back and choose a different directory for your middleware installation.
The next screen will allow you to create the following shortcuts for the components:
“All Users” Start Menu folder will create shortcuts in the Start menu, and all users registered on the system can access these shortcuts
Local user's Start Menu will restrict access to any other user except the current user
The next screen will display the installation summary of all the components that will be installed as part of the current installation. The components installed are:
JDeveloper Studio
Application development framework runtime
WebLogic Server
Java 6.0 Update 24
Click on the Next button to proceed with the installation of the components displayed on the Installation Summary screen. During this process, the installation-related artifacts will be displayed along with the progress of the installation. You have an option to exit the installation at any point of time.
Once the installation is complete, you will be directed to the Installation Complete screen with a message saying Installation is Complete. You are provided with an option Run Quickstart that will display a wizard to launch installed components, configure the server, and show a way to upgrade the server domains. We can also access the online resources and documentation related to JDeveloper 11gR2 using the wizard.
Click on the Done button to display the Quickstart wizard.
To verify the components that are installed, you can check the
MW_HOME/registry.xmlfile.
Congratulations! We just installed JDeveloper 11gR2 Studio Edition on Windows; this means that the initial and most important step for developing this next generation enterprise application is complete.
Starting JDeveloper is the next easy task that follows the installation.
Now it is time for you to have a look at the installation directory of JDeveloper. Perform the following steps to check the folder structure of JDeveloper:
List down the folders that you see inside
MW_HOME.Familiarize yourself with the directory structure
.What can you infer from the folder structure
?
By now you will be excited to launch JDeveloper, but since this is your first time, it will be good to know the options available:
Launch Oracle JDeveloper 11g from the Quickstart wizard after the installation is complete. The Quickstart wizard is also available from All Programs | Fusion Middleware 11.1.2.3.0.
The newly installed products are pinned to the Start menu for easy access. Click on JDeveloper Studio 11.1.2.3.0.
You can also click on All Programs from the Start menu, locate Oracle Fusion Middleware 11.1.2.3.0, and click on JDeveloper Studio 11.1.2.3.0.
Note
The locations from where you can start JDeveloper apart from the shortcuts are:
MW_HOME/jdeveloper/jdeveloper.exeMW_HOME/jdeveloper/jdev/bin/jdevw.exeMW_HOME/jdeveloper/jdev/bin/jdev.exe
The first two options have the same purpose. The last option will open along with a console for diagnostic purposes.
Now you have launched JDeveloper. What do you see? You will see a startup screen called Oracle JDeveloper 11g with the Version 11.1.2.3.0.
By now you will have a better idea of the folder structure of JDeveloper. To have some fun, just guess where the welcome screen is coming from.
If you succeed in identifying the location, you can have your own welcome screen every time you start JDeveloper, just by changing it.
There are some flags that you can set to alter the launching behavior of the IDE. These are set as the command-line options for the shortcut that is used to launch the IDE.
JDeveloper is a multiuser-enabled IDE that allows multiple users to share the same workstation. By default, the IDE configuration files are saved in a directory within the user's working directory. The following are the start-up flags/parameters:
-J-Dide.user.dir=<system_directory>: Using this property, you can override the default behavior to write the configuration files into the specific directory of choice.Tip
An alternate way for this is to set the
JDEV_USER_DIRenvironment variable that points to the user's current working directory.JDEV_USER_HOMEandJDEV_USER_DIRare the variables that are listed in theMW_HOME/jdeveloper/jdev/bin/jdev.bootfile. JDeveloper will look up these variables on startup to set the user's directory. For example:set JDEV_USER_HOME=C:\Users\vtkrishn\AppData\Roaming\JDeveloperset JDEV_USER_DIR=C:\JDeveloper\myworknonag: This will disable all dialogs or messages displayed while starting the IDE. However, the splash screen will still be displayed to the user. Usenosplashto disable the splash screen.noreopen: This option will not reopen the files that were opened in the previous user session.
You have selected JDeveloper to have the user directory in the C:\jdev folder and also opted not to open any kind of message or welcome screen while launching the IDE. The IDE will not have the files from your last session open.
The system directory is created when you first start your JDeveloper and it keeps storing the IDE settings thereafter. The default location on Windows for the JDeveloper 11gR2 release Version 11.1.2.3 is:
C:\Users\%UserName%\AppData\Roaming\JDeveloper\ system11.1.2.3.39.62.76.1
To see some information in the system folder, the JDeveloper IDE should be loaded completely and should not be interrupted during startup. The DefaultDomain folder will be created when the integrated server is started for the first time. Other folders in the system folders are also created when the component is accessed for the first time. The following screenshot shows the system folders, their files, and their description:
Now it's time for you to do some research on the system directory. Perform the following steps:
List down other configuration files that you can locate in the system directory
Analyze how and when these files are created as you learn to develop the application
Change some IDE settings and see which file gets changed
There are two files that are used to store the configuration information of JDeveloper IDE. To add memory to the IDE or JDeveloper during startup, we add the following appropriate Virtual Memory options to these files:
MW_HOME/jdeveloper/ide/bin/ide.confMW_HOME/jdeveloper/jdev/bin/jdev.confTip
To increase the JDeveloper memory, set the following options in the appropriate files specified previously. Some of the JVM options are explained as follows:
AddVMOption is used to optimize the memory for JDeveloper IDE
Xms is the initial Java Heap size
Xmx is the maximum Java Heap size
XX:MaxPermSize is used to set the maximum Java permanent size
Please note that the following setting depends on the available memory in your system:
Add
AddVMOption -Xms512M AddVMOption -Xmx1024Minide.conf.Add
AddVMOption -Xmx512M AddVMOption -XX:MaxPermSize=1024Minjdev.conf.
To configure the boot behavior of the IDE or JDeveloper, we modify the following files:
MW_HOME/jdeveloper/ide/bin/ide.bootMW_HOME/jdeveloper/jdev/bin/jdev.boot
The settings for the files mostly correspond to the system properties. To configure the JDK-related properties for the IDE, modify MW_HOME/jdeveloper/ide/bin/jdk.conf.
For example, you can include options such as the following option for Java2D to allow DirectDraw usage in Windows:
AddVMOption -Dsun.java2d.noddraw=true
You can add other VM options to the .conf files as well. The override sequence is jdk.conf, then ide.conf, followed by jdev.conf.
Tip
Use JAVA_HOME/bin/jvisualvm.exe to monitor and profile Jdeveloper.exe. This tool will also help you gather VM options and system properties of the currently running JDeveloper.
Now it's time for you to verify all available configuration files in the middleware directory. Perform the following steps to verify configuration files:
What are the differences that you see between these files?
Try changing some properties such as
-Dsun.awt.keepWorkingSetOnMinimize=falsein yourjdev.conffile and see how it affects the behavior of the IDE. This option becomes more responsive when JDeveloper IDE is restored after minimizing.
When you launch the IDE without the –nonag startup option, a splash screen followed by a Select Role screen is displayed. The Select Role screen provides the options to select the role in which you want to start the IDE. This is also referred to as shaping the IDE based on the selection. You have an option to configure this in the Switch Roles menu in Tools.
Studio Developer: This role will include all the features available for the IDE. You will be allowed to create applications using different technologies. You have the option to choose the features to include in the Features menu in Tools. This is the commonly used role for ADF development.
Customization Developer: This role is more inclined towards customization for a user to edit the metadata in JDeveloper. This option is used only for ADF customization and is outside the scope of this book.
Database Developer: This role will enable all the features needed for database development using JDeveloper.
Java Developer: This role will enable features that are best suited for Java developers. ADF-related features are not included in this role.
J2EE Developer: Web development using Java EE will be made easy if the user selects this role. All the components related to Java EE development are made available for the user, except ADF technologies.
When JDeveloper IDE is started, the Tip of the Day popup will appear that will give some tips on using the IDE effectively.
Tip
To add your own tip, go to the following location:
MW_HOME\jdeveloper\jdev\doc\studio_doc\ohj\tip.jar
Create an HTML file called tip_11_0460.html (just increase the number, for example, tip_11_0470.html).
Create an image file called tip_11_0470.gif in the images folder if you want to refer to this in your HTML tip.
Have your HTML tip registered in tip_map.smp as shown in the following code snippet:
<map> <mapID target=”tip_11_0470_html”url=”tip_11_0470.html”/> </map>
Now you are at a stage where you can explore the IDE and look for options, as follows:
What are the new features that you see in JDeveloper IDE? Is the look and feel the same as your earlier development environment?
Open the entire menu and see the options available in each menu.
JDeveloper is a perfect IDE for designing and delivering high-end web applications. To support complex designing and customization, the IDE provides various tools and menu options to compete with the requirements of the application developer. These compelling tools, which are shown in the following screenshot, are commonly used by developers in their day-to-day application development:
The Design and Source menus are toggled between the Design and Source views of the file in the Editor window. History and Diagram menus are also displayed based on the active view of the file.
The toolbar for JDeveloper IDE is displayed just below the Menu section, as shown in the following screenshot:
The highlighted tools are added as part of the External Tools option in the Tools menu. The standout features of JDeveloper are:
Drag-and-drop: You can drag-and-drop the content between windows, panels, and sections.
Docking: Almost all the panels within the IDE are “dockable”. You can customize the location of the windows anywhere. Move the panel and drag it to dock the panel or window.
Floating: Panels can be made floating if the
dockableoption is not preferred.Minimize and Maximize: Panels and windows support minimize and maximize features. Right-click on the panel and select the option as appropriate.
Keyboard access: You can navigate, select, and interact with the IDE using shortcut keys.
Searching: Search for the property in the property inspector, Resource palette, structure window, code editor, and so on.
Tabbed view: All the windows that open in the center of the IDE will have the tabbed view.
Splitting: All code editors support splitting of the documents vertically and horizontally. Drag the horizontal splitter to the bottom-right corner to split the document horizontally and the top-right corner to split it vertically, as shown in the following screenshot:
Closing: The Editor window supports the Close, Close others, and Close all options.
Editing Tools: Editor tools are available in the Source and Design view for almost all the files. Some common tools used are Code highlight, Bookmarks, Reformat, Surround, Block coloring, and so on.
There are many configurations, as shown in the following list, related to the IDE that can be configured using the Preferences menu in Tools:
Environment: This section will allow the user to change the look and feel and theme of the page, give an option to save the file on exit, check for modified files, and so on. This section has the following options:
Dockable windows: This customizes how the docking behaves.
Local History: This enables local history for the files stored in the user directory.
Log: This enables logging and specifies where to save the logfile. Also, it customizes the size, lines, and color of the log file.
External Editor: A user can set a preference to open the files in either the external editor or the application. For example, PDF files will be preferred to be opened in an Adobe application.
File Types: This will let the user decide which extensions can be opened by JDeveloper and which editors are used to open the files within JDeveloper.
Shortcut Keys: This is used to configure the shortcut keys for different operations within the IDE.
You can have external applications or tools configured within your IDE using the External Tools menu in Tools.
JDeveloper IDE consists of dockable windows and components that will help in developing ADF applications efficiently. Users may take advantage of these windows to keep track of the changes made, switch between windows, identify and modify particular resources that are part of the application.
Let us see some of the panels and components that are very useful for developing any ADF application. Remember that some of these panels are active only when you have an application open in your workspace. When you open the JDeveloper IDE it will look like the following screenshot:
Download the sample application from http://www.packtpub.com (The
EmpDirectoryApplicationcode downloadable with this book).Click on the Open Application option and locate the
EmpDirectoryApplication.jwsfile.You will now see that the application is listed in the Application Navigator window and the projects are listed for
EmpDirectoryApplication.
We have opened an already existing ADF application to get a feel of how the IDE components work together. Some of the components explained in the following section would need an open application.
The application-related artifacts are managed in a window called Application Navigator. A user can create an application and open existing applications. We will see how to create and open an application in detail in the next chapter.
All open applications are available in the drop-down menu and the user can choose between different applications.
We can select the application, and once the application is selected, we can locate the project and navigate to the related project artifacts. The navigator will display a folder structure of the project that you are currently working on.
The Application menu will list out all the options available to configure an application. The options include creating a new project, opening a project, closing the application, securing the application, application properties, and so on, as shown in the following screenshot:
You are now going to explore the Application menu by clicking on each of the options available:
Try and find what the difference is between the New Project and New options
Try to find some application files using the Menu option provided
Identify what Filter Application means to you
Browse through the Application properties option and familiarize yourself with the options available
The Projects pane will display some options for configuring the projects that are available for the current application, as shown in the following screenshot:
The options on the previous ribbon bar are explained as follows:
Project properties: This icon will display the properties that can be configured for the current project.
Refresh: This will refresh the current project for any file changes.
Working sets: This will help you to filter the current project or files from other open projects. This will be really helpful if you have multiple projects for your application and would like to work on only one project at a time. Having less projects open will load the application faster instead of when all the projects for the application are open.
Navigator display options: This will let the user display the structure of the project efficiently.
Now it's your turn to figure out the options provided for the projects pane:
Open the Project Properties pane and check the available settings for the project. We will be using some of these properties in the coming chapters.
Add some files outside JDeveloper in the
Projectfolder, and click on the Refresh button. Do you see the file in JDeveloper?Where have you seen the Manage Working Set option available in the Working Sets menu before?
You are provided with Navigator Display options for the projects. Try out different options and look for changes.
The Application Resources pane
will list out all the common resources available for the application. Connections and Descriptors are the two folders available in this panel that contain the resources.
Connections: This folder displays all the connections available for the application. It can be anything that gives a context of the connection to the server or to the repository available for the applications.Descriptors: This will list all the configuration files and descriptors available for the application. Common descriptors areadf-config.xml,connections.xml,cwallet.sso,jps-config.xml, andWeblogic-application.xml.
Now you will have to locate the application resource files outside the JDeveloper IDE and then note down the folder structure that you see. Do you see all the files listed under the folder listed in Application Resources? The missing files are subsequently created when you add a database connection or when you secure your application.
The Data Controls pane palette will expose the available Data controls options from the model layer to use in the UI layer. You can refresh the data controls or filter out the data controls using the options available.
The Data controls palette shown in the following screenshot will not be available in the EmpDirectoryApplication file. This will be created automatically when you have the corresponding component created in the model project. Right now don't worry about that.
The Recently Opened Files pane will list all the files opened recently in the application. This pane should not be confused with the Reopen option in the File menu. If you have multiple applications in your workspace, this pane will display recent files specific to the application.
The Structure window, as shown in the following screenshot, will display the structure of the files that the user currently has open. This window is mostly used to insert the components from data control to bind the values. You have an option within the structure window to search for tags.
Double-click on the
web.xmlfile available in theViewControllerproject. Do you see any change in the Recently Opened Files window?In the Structure window, what do you see?
Click on the Source tab of the
web.xmlfile and check the changes in the Structure window.Click on the tag displayed in the Structure window. What do you see in the Source view?
Database Navigator, as shown in the following screenshot, will display the connection information available for all the applications in the IDE. The Database Navigator plugin is a fully functional plugin for a SQL developer. This plugin is not displayed by default, and you can open this from the Database submenu in View.
The Resource palette window will allow the user to create IDE resources and assets. Click on the View menu to display this palette.
There are two types of resources that can be created from the Resource palette. They are Catalogs and Connections.
Catalogs: These are user-defined assets from different repositories used for easy access.
Connections: These are the contexts for the application or IDE added to different repositories or servers.
My Catalogs: This will list all the user-defined resources added as a catalog. For example, if you have a filesystem connection, the catalog can store the images or contents from the filesystem as a user-defined catalog.
Select the New Catalog option from the drop-down menu.
Provide the name
catalogin the Name box.Click on OK to see the new catalog listed in the My Catalog section.
To add a resource to the catalog, you will have to right-click on the resources that are listed in the IDE connections menu. You can add resources from a filesystem connection that is mapped to any of your preferred folders.
Select the Add to Catalog option from the menu.
Select the catalog that you have created from the option.
Click on OK to add the resource to the catalog.
Now the resource will be added to the catalog.
We have now created a catalog for our IDE for the frequent use of resources. Resources added to the catalog are available for the IDE, and we can make use of these resources in different applications and projects.
IDE Connections will have all the connections that are added for the particular IDE. We can use the connections from this window and add them to a particular project by dragging-and-dropping them onto the project displayed in the Database Navigator plugin.
The Component palette will display all the available components that can be added to the UI page. This palette is categorized with different components based on the technology available for the current project. Within each technology available for the project, components are further classified based on behavior. There is an option to search for the component using the search box available at the top of the palette.
Different components are available for different files. For example, the ADF Faces components are displayed if you have the index.jspx file as your current open file from a project that supports ADF technology.
Now it's time for you to explore different components available for different technologies. Use the EmpDirectoryApplication file for your analysis. Perform the following to check for the components available for the IDE:
What are the components listed in the palette for
web.xml?Open
trinidad-config.xmland check if it's listing the same components as inweb.xml.
Run Manager will display all the current running processes and give an option to terminate whenever needed. This is not shown by default and can be enabled from the View menu.
The Log window will display log messages related to the projects. There are other tabs embedded within the Log window to categorize the logs that are generated, as follows:
IntegratedWeblogicServer: This displays the log information of the integrated WebLogic server. This Log window is helpful in identifying application errors during runtime. It will display the log information while starting and stopping the server.
Messages: This tab displays the compilation logs.
Extensions: This tab will display logs related to the installed IDE extensions.
Compiler: This tab will display the warnings and errors that occurred while the project was being compiled.
You will use the code editor section to write the code. The Java code file can be opened in the editor by double-clicking on the Application Navigator window. There are different options available within the code editor that will be helpful to run the code efficiently.
Design: Files with extension such as
.jsffor.jspxwhich represent a UI page will have aDesignmode added to design the pages.Source: The Source tab is added for all the files where a user can change the content using the code editor.
Bindings: This section will help the user interact with the data bindings bounded to the UI components. The
page-definitionfile will hold the binding information, and it is shown in this view.Preview: This will help to preview the page designed and imitate the components rendered at runtime.
History: This view is common for all files, and the local history of the file changes is tracked in this view.
The Property Inspector pane will help to alter the property of the currently selected component or tag in the Design or Source mode of a page.
All the previously explained windows and panels are available in the View menu.
Now it's time for you to check the usage of the code editor and the Property Inspector pane as follows:
Q1. Which role will enable all the features of the IDE?
Database developer
Java developer
Studio developer
Q2. Which IDE component is used to drag the model data and drop it on the UI page?
Application Navigator
The Data Controls palette
The Resource palette
Q3. IDE connections are created only for an application in JDeveloper.
True
False
Q4. _________ and _________ are the two folders displayed in the Application Resources panel of the IDE.
Q5. Which of the following features are supported in JDeveloper?
Drag-and-drop
Docking
Floating
Searching
All of the above
Let us recap what we have learned in this chapter. We started our chapter by downloading and installing JDeveloper 11gR2. Then we learnt about some important configuration files for JDeveloper IDE. Later we discussed some of the roles to customize the IDE for different users. We also gained some knowledge about the components within the environment.
We got a chance to familiarize ourselves with common tasks, such as docking the panels, searching within the panels, and closing the files and windows. Finally, we learnt where to set preferences and some common user preferences for the IDE.
In the next chapter, we will learn more about the architecture of the ADF framework and how to create and run a sample ADF application.