Description
Codelobster is a portable integrated development environment (IDE) primarily for PHP, which also supports HTML, CSS, and JavaScript development.
Introduction
1. Web Frameworks and Content Management Systems allow developers to heavily leverage on tried and tested modules and design patterns allowing the developer to concentrate on the application logic.
2. However, despite PSR (PHP Standards Recommendations), each language framework has some tacit standards and design methods which are unique. When developing on such platforms, an IDE that supports your frameworks logic and flow will heavily gear your efficiency for the better.
3. IDEs are a very focal part of software development. Fully fledged platforms of their own offering useful features that heavily influence developer productivity and code quality as well. Today I am using a portable PHP IDE named Codelobster to achieve good productivity when developing applications with well known frameworks.
Download Codelobster
1. Codelobster portable integrated development environment (IDE) primarily for PHP, which also supports HTML, CSS, and JavaScript development. Plug-ins are available for Drupal, WordPress, Smarty, Joomla, JQuery, Facebook, Codeigniter, Yii, and CakePHP.
Creating a Symfony Project
1. For this tutorial we shall be developing on Codelobster a simple personal budgeting application based on Symfony 2 framework.
2. When you are using the Pro version of CodeLobster, all Plugins are available to you. When using the Lite or Free version, you can opt to purchase the specific plugin for your project.
3. On the CodeLobster Plugin menu, select Symfony >> Create Project.
4. The wizard screen will then take you through a series of forms to gather more information about your Symfony project.
5. CodeLobster will take a while to download the Symfony framework and run the installer using your provided settings. Once it has completed running the install process, we can begin our Symfony development.
6. You may want to configure the path to the Symfony console via Tools >> Preferences >> Symfony >> Settings. The path to Symfony console is in the app directory of your project.
7. On your command line navigate to your project root and start the In-Built Symfony console which runs PHP's internal Web Server for use in development – php app/console server:run – Your development web app should now be accessible on browser via http://127.0.0.1:8000 where you can preview your app while you build it.
Our Application Requirements
1. Our personal budgeting application shall be very simple. See the requirements below:
a) The user will enter their desired monthly budget based on common personal expenditure categorizations. For simplicity, the model will not factor in rolling up and down of expenditure categories (e.g. rent, groceries rolling up to household expenditure). We will treat each expense category individually.
b) Ideally, the personal budget may be updated monthly after review.
c) The budget report shall be available on demand to be run on the system.
d) An amber alert shall be generated by the system when the monthly expenditure is within a margin of 15% to breach for a particular expenditure category.
e) A red alert shall be created for when the system has actually reached the category limit
2. These are simple requirements for the sake of the tutorial. In reality, we would add some more functionality such as the aforementioned rolling up of expenditure categories as well as multi-currency support.
3. We will also not add other features that can make the app usable in real world, such as choosing date ranges for the expenditure vs budget when running the report.
Creating The Database Assets
1. Our database shall consist of two tables: one for budget input, one for expenditure input; as well as one view, for our report generator. On CodeLobster, click on Tools >> MySQL >> SQL Manager.
a) Enter your database host and authentication parameters. The database we are connecting to is named budget.
b) Your connection should appear in the SQL window. Right Click on it and Click Connect.
c) Right click the connection and click “Create Table”
2. The assets we require are defined in SQL as below. If you choose to type SQL as is, you can do it via CodeLobsters SQL Editor. Right click your connection and click “New SQL File“. You aided by the SQL Keyword and Asset hints in this the SQL editor.
3. ote that we actually have 3 views but we need one in our logic layer. The other two are necessary because MySQL does not support SELECT statements in the FROM clause of a view, thus we create two views as feeders to the one view that we want for our report; which will intersect data from the budget and expenditure views.
4. We shall name the main view v_budget_vs_expenditure. I shall not go into detail of explaining the View SQL though the concept is that for budget table, each expenditure category e.g. Entertainment must pick the latest entry added i.e. pick it as an addendum to previous entries, while the expenditure view must sum expenditures under a category to get period expenditure for the category.
5. The two data-sets thus contain one occurrence per category, but for different reasons.
Creating The Application Controllers
1. Symfony allows us to leverage on the MVC design pattern, enabling to implement our application cleanly. We require the following controllers for our application.
a) Index (homepage)
b) Budget controllers for Create, Read, Update, Delete
c) Expenditure controllers for Create, Read, Update, Delete
d) Report generator controller
Index Controller
1. We would like the landing page to be a dashboard type page containing links to the other functions provided by the application.
2. We shall be using Twig, Symfony's templating system, which if we could describe in two words would be simple and powerful.
3. You would need to see Symfony documentation to learn more about Twig. We may have also used PHP templates for this.
4. Open for editing the DefaultController of your application via the CodeLobster Project Window; Src >> AppBundle >> Controller >> DefaultController.php
5. In the PHPDoc comments section, we have added a route to this controller using the annotation @Route. We are routing to our index (/), and naming the annotation homepage for reference in other parts of the application.
6. We may also have added routing configuration using YAML or XML configurations. See Symfony documentation for more. The controller returns the call $this->render(…) which itself returns a Response object that gets parsed to HTML. The Symfony Response object encapsulates actual HTTP Response in an OOP implementation.
7. Note that we are rendering our template named index.html.twig, which by default we shall locate in directory app/Resources/views/default
8. The Twig template for our index is presented below.Twig has a large syntax. Our template contains native HTML as well in most parts. CodeLobster gives HTML hints for elements as well as attribute names.
9. CSS, JavaScript and Angular hinting is also available out of the box. You may also choose to create your HTML elements with the HTML toolbar, which I find useful when I am entering HTML special characters. You can enable the HTML toolbar (or any other toolbar) via View >> Windows menu link on CodeLobster.
Refactoring The Template Design
1. Code reuse is an important principle of software development. Our budget application will require that we have the header and footer section in each view, and that the links to the various views be included in the header section.
2. Thus we create a header and footer template in the app/Resources/views/ directory which we shall then embed to the base.html.twig template that will allow us to propagate the header and footer to each view that extends the base via {% extends 'base.html.twig' %} block.
3. Because a template that extends another cannot implement html tags, we shall use the {%i include %} block when we face this scenario, such as in the form views.
Budget and Expenditure Controllers
1. Creating data driven applications often requires one or all of the CRUD operations. Symfony comes bundled with Doctrine and has the data driven architecture in mind. We need to generate the CRUD forms for our tables.
2. We can do this manually too, but we will choose to take advantage of one of the excellent SensioGeneratorBundle features, generating the controller and forms.
3. Before we go further, keep in mind for each of these data driven functionalities the logic is:
>>> Database Asset is Mapped in PHP Object by
>>> an Entity (a Doctrine entity) whose properties are mapped to Form objects by
>>> a Form Type object which is manipulated by a
>>> Controller method which is accessed from client side via a
>>> Route
4. The SensioGeneratorBundle shall generate our Form, Controller, handle routing as well as create front end views.
5. Before we generate the CRUD forms, as we have seen, we need to create our entities first. A Symfony form maps entity data to a persisted object. Thus, we need doctrine entities. These shall be stored in the Entity directory of your bundle.
6. We can use the Doctrine console to generate these entities, or manually generate them. Like Symfony, you have the choice of Annotation, Yaml or XML mapping.
7. We will generate three Entities, one for our budget_register table, one for the expenditure_register table and one for the view named v_budget_vs_expenditure. These vanilla Doctrine entities and are saved under src/AppBundleEntity directory.
8. Next, to generate Controllers, Views and handle routing, run the command below; and you shall be guided through a series of questions to establish what assets need to be generated and how.
For more inputs on Codelobster PHP Training/staffing you can connect here.
Contact the L&D Specialist at Locus IT.
Locus Academy has more than a decade experience in delivering the training/staffing on Codelobster PHP for corporates across the globe. The participants for the training/staffing on Codelobster PHP are extremely satisfied and are able to implement the learnings in their on going projects.
Reviews
There are no reviews yet.