What is Visualforce ?
Visualforce is a markup based language of Salesforce used to develop user interfaces in Salesforce CRM platform. Markup language means the tag based annotation is followed to denote the coding elements. HTML is an another example of markup based language. Every element will have tag eg., <body></body>, <head></head> etc., XML is also a markup language type.
Similarly, Visualforce consists of different markups termed as Visualforce Tags or components in Salesforce terminology.
Example:
<apex:page> <apex:form> <apex:inputField> <apex:outputLabel>
Each of these components has its own properties helps us to create custom page in salesforce environment.
Every tag shown above is having a corresponding closing tag.
Example:
<apex:page> </apex:page> <apex:inputField> </apex:inputField>
The closing can also be done in the same tag with slash at the end as below. Either format will be accepted in the system.
<apex:form/> <apex:inputField/>
Where to write Visualforce?
There are 4 basic ways available
1 Using Salesforce UI
2 Using Salesforce URL Editor
3 Using Developer Console
4 Using Eclipse Environment (with force.com plugin installed)
1 Salesforce UI
Navigation: Setup Menu -> Build -> Develop -> Visualforce Pages
2 Using Salesforce URL Editor
To get this editor, an option in your user page needs to be enabled. Just go to your user page under Setup Menu -> Administer -> Manager Users -> Users
Then click on your user name to get the detail page. Scroll down to below, there is an option “Development Mode”. This check box has to be checked.
Next to domain URL of your login, use the keyword ‘apex‘ and then backslash with visualforce page name as below
This will load the page MyFirstPage if already exists else will show a link as below. By click on the link, a a new page can be created with default template.
The editor is accessible at the bottom of the same page.
Hence it helps developer to debug the code and see the results on the same page. Editor has inbuilt auto code completion for Visualforce component library, the save option, code alignment etc.,. The component library is also available in the form of link at the right side of the editor.
3 Developer Console
Navigation: Next to Setup Menu
Your name drop down -> Developer Console.
The Developer Console is an integrated development environment with a collection of tools you can use to create, debug, and test applications in your Salesforce organization. The file menu is having user friendly option to create pages. For new page creation, the page name has to be given that would create a page with <apex:page> </apex:page> content. Developer Console has auto code completion feature, highlights the syntax etc.,. Only the error free code will be saved into the system always. The syntax errors will be notified at the bottom and can be accessed by click on problem tab shown below.
4 Eclipse with Force.com IDE plugin
It provides a comfortable environment for programmers familiar with integrated development environments, letting you code, compile, test, package, and deploy all from within the IDE.
The Force.com IDE is available to download from the salesforce knowledge repository site – developer.salesforce.com, which includes installation instructions. After you install the Force.com IDE, you can access the main interface of the Force.com IDE. Start up the IDE and choose Window > Open Perspective > Other > Force.com.
The easiest way to get started with a project is to choose File > New > Force.com Project. After entering the credentials for your Force.com organization, you can select which metadata components (objects, classes, pages, etc.) you want to work with in the IDE.
Link: how to create a page for account entry? Link: Visualforce Apex Examples