Examples for Developer #6 Week of Coding

Submitted by Abhishek Lal B on Wed, 07/12/2017 - 20:03

I have been porting Example for Developer from Drupal 7 to Drupal 8 as part of this year’ s Google Summer of Code (GSoC). This summer program is an opportunity for university students to work on projects connected with open source organisation. I have been really lucky to be a part of this initiative. I could explore deep of more technologies, version control systems as part of my project in Drupal. This gives young students a platform where they are assigned mentors who are experts and experienced in various software.

Last week, with the help of my mentor Navneet Singh we were able to put up a working patch of Contextual examples.

contextual example
Fig1:- Landing page of Contextual example in Drupal 8

 

Along with that I also started work on my next port AJAX Example. AJAX stands for Asynchronous JavaScript and XML. AJAX is a new technique for creating better, faster, and more interactive web applications with the help of XML, HTML, CSS, and Java Script. With AJAX, when you hit submit, JavaScript will make a request to the server, interpret the results, and update the current screen. In the purest sense, the user would never know that anything was even transmitted to the server. Well a brief working of AJAX can be explained using the simplest example (which is already ported to Drupal 8 by Navneet Singh)

 

ajax
Fig2 : Simplest AJAX Example landing page in Drupal 8
ajax
Fig 2.1: Simplest AJAX example


 

 The basic function of this example is to provide user further knowledge about AJAX API which updates inside the box (refer Fig 2 & 2.1) automatically without reloading the page. This happens when the two is changed to three a PHP callback is triggered, which performs server-side logic and may return updated JavaScript commands to run. After the return, the browser runs the JavaScript or updates the markup on the fly, thus no full page refresh necessary.

My next target is to port progress bar example, progress is a functionality of AJAX it choose either a throbber or progress bar that is displayed while awaiting a response from the callback, and add an optional message.

progress bar
Fig 3: AJAX Example- progress bar example on Drupal 7

I was able to make the appropriate routing and forms files and maded the recomended fuctional calls but I still struggling with few error. Codes of the previously ported and currently porting modules are actively maintained on my Github repo. By the next week, I am hoping that I would complete the progress bar example, generating checkboxes and textfeilds examples.

Tags