# Custom Component Controllers

Similar to standard Visualforce pages, custom components can be associated with a controller written in Apex. This association is made by setting the `controller` attribute on the component to your custom controller. You can use the controller to perform additional logic before returning the component's markup to the associated page.

## Accessing Custom Component Attributes in a Controller

To access the value of a custom component attribute in an associated custom component controller:

1. Define a property in the custom component controller to store the value of the attribute.

2. Define a getter and setter method for the property. For example:

   ```controller
   public class myComponentController {
       
     public String controllerValue;
       
     public void setControllerValue (String s) {
       controllerValue = s.toUpperCase();
     }
       
     public String getControllerValue() {
       return controllerValue;
     } 
   }
   ```

   Notice that the setter modifies the value.

3. In the `<apex:attribute>` tag in your component definition, use the `assignTo` attribute to bind the attribute to the class variable you just defined. For example:

   ```markup
   <apex:component controller="myComponentController">
     <apex:attribute name="componentValue" description="Attribute on the component."
                     type="String" required="required" assignTo="{!controllerValue}"/>
       <apex:pageBlock title="My Custom Component">
         <p>
           <code>componentValue</code> is "{!componentValue}"
           <br/>
           <code>controllerValue</code> is "{!controllerValue}"
         </p>
       </apex:pageBlock>
       Notice that the controllerValue has been upper cased using an Apex method.
   </apex:component>
   ```

   Note that when using the `assignTo` attribute, getter and setter methods, or a property with `get` and `set` values, must be defined.

4. Add the component to a page. For example,

   ```apex_page
   <apex:page>
     <c:simpleComponent componentValue="Hi there, {!$User.FirstName}"/>   
   </apex:page>
   ```

The output of the page will look something like the following:

![Example page.](https://a.sfdcstatic.com/developer-website/sfdocs/platform/media/salesforce-pages-developers-guide/pages_component_controller_attributes.jpg)

Notice that the Apex controller method changes `controllerValue` so that it is displayed with uppercase characters.