Women's Day Blog Series: How do women technologists contribute to the Drupal Community?

Drupal is a powerful content management system that powers millions of websites around the world. Behind the success of Drupal are the many contributors who have worked to improve and expand the platform over the years. Among these contributors are women who have made significant contributions to the Drupal community.

In this blog, we'll be exploring the various ways that women technologists contribute to the Drupal community. We'll be looking at the roles that women play in the development and growth of Drupal, and the unique perspectives and insights that they bring to the community.

So join us as we celebrate the contributions of women technologists to the Drupal community, and explore how they help the future of this powerful platform.

Here are some more specific ways in which women have contributed to the Drupal community:

Contributing to Drupal core

Women technologists have made significant contributions to Drupal's core codebase. They have contributed patches, bug fixes, and new features that have been included in the Drupal software.

Developing Drupal modules and themes

Women have created Drupal modules and themes that address specific needs and interests. For example, the "Drupal for Girls" module was created to teach young girls how to code using Drupal.

Participating in Drupal events and conferences

Women have played an active role in Drupal events and conferences, both as attendees and as speakers. They have shared their knowledge and expertise on a range of topics, including coding, web development, design, and more.

Mentoring and supporting other women in the Drupal community

Women in the Drupal community have also played a crucial role in mentoring and supporting other women in the community. They have provided guidance, resources, and mentorship opportunities to help other women succeed in the industry.

Advocating for diversity and inclusion

Women in the Drupal community have been strong advocates for diversity and inclusion. They have pushed for more representation of women and other underrepresented groups in leadership roles, conferences, and events. They have also worked to create safe and welcoming spaces for all members of the community.

Overall, women in the Drupal community have made significant contributions to the industry, and their contributions are essential to the growth and success of Drupal. It is important to continue to support and empower women in the technology industry to ensure that the industry is diverse, equitable, and inclusive for all.

How to Build a Real-Time Video Chat Application with WebRTC

WebRTC (Web Real-Time Communication) is an open-source technology that enables real-time communication between browsers or devices. It provides a set of APIs for establishing peer-to-peer audio, video, and data channels between web browsers. In this tutorial, we'll learn how to build a real-time video chat application using WebRTC and JavaScript.

Prerequisites

Before we begin, you need to have a basic understanding of HTML, CSS, and JavaScript. You also need to have a recent version of a modern web browser like Google Chrome, Mozilla Firefox, or Safari that supports WebRTC.

We'll be using the getUserMedia API to access the user's webcam and microphone, and the RTCPeerConnection API to establish a peer-to-peer connection between two clients.

Setting up the HTML and CSS

Let's start by creating a basic HTML structure for our video chat application. We'll have two video elements, one for the local video stream and one for the remote video stream, and two buttons for initiating and ending the call.

We've defined two video elements with IDs local-video and remote-video, which will be used to display the local and remote video streams. We've also added two buttons with IDs call-btn and hangup-btn for initiating and ending the call. Finally, we've added a <script> tag to include the JavaScript code for our application.

We've also added some basic CSS to set the width and height of the video elements to 100% and 300 pixels, respectively, and to set the object-fit property to "cover" to make the video fill the entire element.

Setting up the JavaScript

Now, let's create the app.js file and include it in the HTML using a <script> tag. We'll start by defining some variables for the local and remote video elements, the local and remote video streams, and the RTCPeerConnection object.

We've defined a variable localVideo to reference the local video element using its ID.

We've also defined three other variables localStream, remoteStream, and peerConnection to hold references to the local video stream, the remote video stream, and the RTCPeerConnection object, respectively.

Next, we'll define some event listeners for the call and hangup buttons.

We've defined two variables callBtn and hangupBtn to reference the call and hangup buttons using their IDs. We've also attached event listeners to both call and hangup.

Now let's define the call function, which will be called when the user clicks the "Call" button. This function will initiate the call by creating an RTCPeerConnection object, getting the local stream, and adding tracks to the connection.

In this function, we've created a new RTCPeerConnection object and added tracks to the connection using the addTrack method. We've also set up an event listener for the track event, which will be called when a remote track is added to the connection. In this listener, we've set the srcObject property of the remote video element to the stream from the track event and stored it in the remoteStream variable.

We've then created an offer using the createOffer method of the RTCPeerConnection object and set it as the local description using the setLocalDescription method. At this point, we need to send the offer to the other client using a signaling server. The signaling server is responsible for exchanging SDP messages between the two clients to establish the peer-to-peer connection. However, we won't cover the signaling server in this tutorial.

Finally, let's define the hangup function, which will be called when the user clicks the "Hang Up" button. This function will end the call by closing the RTCPeerConnection object and stopping the local and remote video streams.

In this function, we've closed the RTCPeerConnection object using the close method and set it to null. We've also stopped all the tracks in the local stream using the stop method, set the srcObject property of the local and remote video elements to null, and set the localStream and remoteStream variables to null.

Conclusion

That's it! We've built a simple real-time video chat application using WebRTC and JavaScript. Of course, this is just the beginning, and there's a lot more you can do with WebRTC, such as adding text chat, screen sharing, and recording capabilities. But we hope this tutorial has given you a good foundation for building real-time applications using WebRTC.

You can find the complete code for this tutorial on our GitHub repository. Happy coding!

 



Upgrade Now: Boost Business with Real-Time Video Chat using WebRTC!

 

Women's Day Blog Series: Women Technologists in the Drupal World

Welcome to our blog series on Women Technologists in the Drupal World on the special occasion of International Women’s Day, 8th March 2023! In this series, we'll be exploring the experiences and contributions of women who work with Drupal, a popular content management system used by organizations around the world.

Despite the many advancements in technology and the growing demand for skilled professionals, women continue to be underrepresented in the tech industry. However, there are many women who have made significant contributions to the Drupal community, and we want to celebrate their accomplishments and learn from their experiences.

Throughout this series, we'll be talking to women in Valuebound who have worked with Drupal in various capacities, including as developers, designers, project managers, and community members.

We'll be asking them about their journeys, insights into the Drupal world, and the challenges and opportunities they have faced. Join us in celebrating Women Technologists in the Drupal World on International Women's Day 2023! Explore the experiences and contributions of women in Drupal, and initiatives for diversity and inclusion at Valuebound.

We hope that this series will inspire and encourage more women to pursue careers in technology and get involved in the Drupal community. Stay tuned for our first post, where we'll be talking about the challenges of women technologists and how Valuebound supports these ‘DrupalChix’.

Challenges of Women Technologists

Women have made significant strides in technology over the past few decades. However, there is still a long way to go to achieve gender equality in this industry. Drupal, an open-source content management system, is no exception. While there are many talented women technologists working in the Drupal world, they still face various challenges.

Gender Gap: According to a study by the National Center for Women and Information Technology, women hold only 26% of the computing workforce. The Drupal community has recognized that women are underrepresented and has taken steps to address it. The Drupal Diversity and Inclusion Group, for example, is dedicated to promoting diversity and inclusion within the Drupal community.

Lack of Representation:  Women's contributions are often overlooked, and their work may be attributed to their male colleagues. Additionally, women are less likely to be invited to speak at conferences and events, limiting their opportunities to share their knowledge and expertise.

Now many women technologists are making significant contributions to the Drupal community. Women like Donna Benjamin, a Drupal Association Board member, and Rachel Lawson, the Drupal Association's Community Liaison, are among the most influential members of the Drupal community. They work tirelessly to promote diversity and inclusion in Drupal and provide opportunities for women to contribute to the community.

Modules and Themes for Women’s Needs in the Drupal world: How does Valuebound Support

One of the ways that women are making an impact in the Drupal world is by creating modules and themes that are tailored to women's needs. For example, the "Women in Tech" module highlighted women's contributions to technology and inspired others to pursue careers in this field. Similarly, the "Women of Drupal" theme showcases women's achievements in the Drupal community.

Drupal Diversity and Inclusion Group

Women are also leading Drupal initiatives that focus on critical social issues. For example, the Drupal Diversity and Inclusion Group is working to create a more inclusive and diverse community by promoting diversity in leadership, speaking opportunities, and events. The Drupal Association's Community Working Group is dedicated to creating a safe and welcoming community for all Drupal users, regardless of their gender, race, or sexual orientation.

At Valuebound, The Drupal Group fosters diversity & inclusion in the community through initiatives that empower underrepresented groups and create a more welcoming environment.

Women in Drupal Initiatives

To promote more women's participation in Drupal, various initiatives have been launched. For example, Drupal has the "Women in Drupal" initiative that provides mentorship, resources, and networking opportunities for women in the Drupal community. The initiative also organizes events and workshops that are designed to empower women in technology.

Valuebound is actively working to promote women's representation in the tech industry by creating opportunities for them to speak and participate in conferences and events. This helps showcase their expertise and insights while inspiring other women to pursue careers in technology.

As an illustration, during the Bengaluru edition of the DrupalCamp India Refresh 2022, Indra Patil, a Software Development Engineer, and Top Woman Drupal Contributor at Valuebound, singularly represented the company in attendance.

Indra_DrupalCamp_India_Refresh_2022

Conclusion

Women technologists have made significant contributions to the Drupal community, and their presence has become more visible in recent years. However, there is still a long way to go to achieve gender equality in this industry.

By promoting diversity and inclusion, providing opportunities for women to speak at events and conferences, and encouraging mentorship and networking, we can continue to attract and retain talented women technologists. Ultimately, it is up to all of us to work towards creating a more inclusive and equitable technology industry.

Integrating Component-based Theming with Drupal Layouts: Tips and Tricks

Component-based theming is a powerful approach to web development that allows you to create reusable design components that can be easily combined to create complex pages and layouts. In Drupal, component-based theming is made possible by the Twig templating system and tools like Pattern Lab and Fractal. However, integrating component-based theming with Drupal layouts can be challenging. In this article, we will discuss how to integrate component-based theming with Drupal layouts, including tips for creating responsive designs.

What are Drupal Layouts?

Drupal layouts are a powerful tool for managing complex page layouts. With layouts, you can create custom layouts for your content, including multi-column layouts, nested layouts, and more. Layouts are built using regions, which are areas of the page where content can be placed. Drupal provides a number of pre-defined regions, such as header, footer, and sidebar, but you can also create custom regions.

Integrating Component-based Theming with Drupal Layouts

To integrate component-based theming with Drupal layouts, you need to create regions in your component templates that correspond to the regions defined in your layout. For example, if your layout has a header region and a footer region, you would need to create header and footer components that can be inserted into those regions.

Here's an example of how to create a header component in Drupal using Twig: 

In this example, we've created a simple header component that contains a navigation menu. Note that we've wrapped the component in a <header> element with a site-header class, which we can use to style the component later.

To insert this component into a Drupal layout, we would need to define a header region in our layout template, like so: 

In this example, we've defined a header block in our layout template, and used the include function to insert our header component. Note that we've used the @components namespace to refer to our component, which is defined in the templates/components directory.

Creating Responsive Designs with Component-based Theming and Drupal Layouts

One of the challenges of integrating component-based theming with Drupal layouts is creating responsive designs. To create a responsive design, you need to ensure that your components can adapt to different screen sizes and layouts.

One way to create responsive designs with component-based theming and Drupal layouts is to use a mobile-first approach. With a mobile-first approach, you start by designing for the smallest screen size, and then gradually add styles and components as the screen size increases.

Here's an example of how to create a responsive header component in Drupal using Twig: 

In this example, we're using a set of classes (header_classes) to control the layout of the header component. We're also using conditional statements to check if the primary and secondary navigation menus exist, and only displaying them if they're present.

To make the header component responsive, you could add media queries to adjust the layout and styling based on screen size. For example: 

In this example, we're using a media query to adjust the layout and styling of the header component when the screen size is less than or equal to 767 pixels. We're changing the display property of the primary navigation menu and menu toggle button to none and block, respectively, and adjusting their widths and margins to make them responsive. We're also hiding the secondary navigation menu using display: none.

With these adjustments, the header component will adapt to different screen sizes and provide a great user experience on all devices.

Integrating component-based theming with Drupal layouts can be a powerful way to create reusable, responsive designs. By creating components that correspond to regions in your layout, you can easily mix and match components to create complex layouts that work across different devices and screen sizes.

Of course, this is just the beginning of what you can do with component-based theming and Drupal layouts. There are many other techniques and tools you can use to create responsive designs, such as CSS grid and flexbox, as well as more advanced tools like Drupal's Layout Builder.

If you're interested in learning more about component-based theming and Drupal layouts, there are many great resources available online. Drupal.org has extensive documentation on Twig theming and layout management, and there are many tutorials and examples available on sites like Drupalize.me and Acquia.com. With the right tools and knowledge, you can create beautiful, responsive designs that are easy to maintain and adapt to changing needs.

WebRTC and the Future of Real-Time Streaming Applications

WebRTC (Web Real-Time Communication) is a set of standardized protocols and APIs that allow real-time communication between web browsers, mobile applications, and IoT devices. Originally developed by Google in 2011, WebRTC has since become a popular choice for real-time communication and streaming applications due to its low latency, high-quality audio and video, and ease of implementation.

So, what does the future hold for WebRTC and real-time streaming applications from a technical perspective? In this post, we'll explore some of the trends and predictions for WebRTC and its impact on the future of real-time communication and streaming.

Enhanced Codec Support

WebRTC already supports a variety of audio and video codecs, such as Opus, VP8, and H.264. However, we can expect to see even more codec support in the future, including support for higher quality codecs such as VP9 and AV1. This will allow for even higher quality audio and video streams with lower bandwidth requirements.
Improved network performance

As networks continue to evolve and improve, WebRTC will be able to take advantage of these improvements to provide even better performance. This includes improvements in areas such as bandwidth, latency, and network reliability, all of which will help to improve the overall quality of real-time communication and streaming.

Increased Adoption of Simulcast

Simulcast is a technique that allows WebRTC to send multiple versions of the same video stream at different quality levels, allowing the receiver to choose the version that best suits their network conditions. This technique is becoming increasingly popular and is expected to see even greater adoption in the future.

Emerging Use Cases for WebRTC

WebRTC is already being used in a variety of industries, but we can expect to see new and emerging use cases in the future. For example, the rise of edge computing and low-latency networks could enable new use cases for real-time communication and streaming, such as remote gaming and augmented reality applications.

Continued Development and Innovation

WebRTC is a rapidly evolving technology, and we can expect to see continued development and innovation in the years to come. This includes new features and capabilities such as WebRTC DataChannels, which allow for real-time data transfer between peers, as well as continued optimization for performance and reliability.

In conclusion, WebRTC is a powerful and versatile technology that is well-suited for real-time communication and streaming applications. With continued development and innovation, we can expect to see even more capabilities and use cases emerge in the future, making WebRTC an even more essential tool for developers and businesses alike.

Building Decoupled Drupal Applications with GraphQL

Decoupled Drupal is a popular approach to building web applications that separates the content management system (CMS) from the front-end user interface. This allows for greater flexibility and scalability in the development process, as well as the ability to use different front-end technologies for different parts of the application.

One popular way to implement decoupled Drupal is by using GraphQL, a query language for APIs that provides a more efficient, powerful, and flexible alternative to RESTful APIs. In this article, we'll explore how to build a decoupled Drupal application with GraphQL, using Drupal as the CMS and React as the front-end framework.

Step 1: Set Up Your Drupal Environment

The first step in building a decoupled Drupal application with GraphQL is to set up your Drupal environment. This will involve installing Drupal and configuring it to expose your content as a GraphQL API.

To do this, you can use the Drupal GraphQL module, which provides a plugin system for extending the GraphQL schema with custom types, fields, and queries. Once you've installed and enabled the module, you can define your custom types and fields using the Drupal hook system.

Here's an example of defining a custom GraphQL type in Drupal:

This code defines a custom GraphQL type called "Article" with fields for the title, body, and image of the article. The resolve function for the field_image field uses the Drupal ImageStyle service to generate a URL for the image based on the specified image style.

Step 2: Set Up Your React Environment

Once you've set up your Drupal environment, the next step is to set up your React environment. This will involve creating a new React application and installing the necessary dependencies.

To create a new React application, you can use the Create React App tool, which provides a simple way to set up a new React project with all the necessary configuration and dependencies. Here's an example of creating a new React application:

npx create-react-app my-app
cd my-app

Next, you'll need to install the necessary dependencies for working with GraphQL in React. For this, we'll be using the Apollo Client library, which provides a convenient way to query GraphQL APIs and manage the resulting data.

To install Apollo Client, you can run the following command:

npm install @apollo

Step 3: Connect to the GraphQL API

Once you've set up your Drupal and React environments, the next step is to connect to the Drupal GraphQL API from your React application. To do this, you'll need to create an instance of the Apollo Client and configure it with the URL of your GraphQL endpoint.

Here's an example of setting up the Apollo Client in a React component:

This code creates a new Apollo Client instance and configures it with the URL of your Drupal GraphQL endpoint.

Step 4: Query the GraphQL API

Once you've connected to the Drupal GraphQL API from your React application, the next step is to query the API for the data you need. To do this, you can use the useQuery hook provided by Apollo Client, which allows you to define your query as a GraphQL string and execute it against the API.

Here's an example of querying the Drupal GraphQL API for a list of articles:

This code defines a GraphQL query for fetching a list of articles from Drupal, using the nodeQuery field provided by the Drupal GraphQL module. The resulting data is then rendered as a list of articles in a React component.

Step 5: Display the Data

Finally, once you've queried the Drupal GraphQL API for the data you need, the last step is to display the data in your React application. This will involve rendering the data in your components using JSX, the declarative syntax used by React for describing user interfaces.

Here's an example of rendering the list of articles fetched from Drupal in a React component:

This code renders a list of articles fetched from Drupal in a React component, using conditional rendering to handle the loading and error states of the data.

Ready to build your own decoupled Drupal application with GraphQL? Contact us to learn how our expert team of developers can help you bring your ideas to life.

Developing Custom Drupal Modules Using Object-Oriented Programming

Drupal is a popular content management system (CMS) that is widely used to build complex websites and web applications. One of the main advantages of Drupal is its modular architecture, which allows developers to extend and customize its functionality by creating custom modules.

In this article, we'll explore how to develop custom Drupal modules using object-oriented programming (OOP) principles. By using OOP, we can create more maintainable, reusable, and testable code that is easier to understand and modify.

Step 1: Set up your Drupal environment

Before we can start developing custom modules, we need to set up a local development environment for Drupal. This typically involves installing a web server, a database server, and a Drupal distribution on your local machine. 
Here's a high-level overview of the steps involved in setting up a local Drupal environment:

  1. Install a web server such as Apache or Nginx
  2. Install a database server such as MySQL or PostgreSQL
  3. Install PHP and its required extensions
  4. Download and extract the latest version of Drupal from drupal.org
  5. Create a new database for your Drupal installation
  6. Run the Drupal installer and configure your site settings

Step 2: Create a new Drupal module

Once you have set up your Drupal environment, the next step is to create a new Drupal module. In Drupal, a module is a collection of files that provide additional functionality to your site.

To create a new Drupal module, you need to create a new directory in the "modules" folder of your Drupal installation and create a new "MODULE_NAME.info.yml" file and a "MODULE_NAME.module" file inside that directory.

Here's an example of creating a new Drupal module called "my_module":

  1. Create a new directory called "my_module" in the "modules" folder of your Drupal installation
  2. Create a new file called "my_module.info.yml" inside the "my_module" directory with the following contents: 

This file defines the basic metadata for your module, including its name, description, type, and compatibility with Drupal 8 and 9.

 3. Create a new file called "my_module.module" inside the "my_module" directory with the following contents:

This file defines a custom menu item for your module and a page callback function that returns a simple message.

Step 3: Use object-oriented programming (OOP) principles

Now that we have a basic Drupal module set up, the next step is to start using OOP principles to create more maintainable and reusable code.

In Drupal, OOP is primarily used in the creation of classes and interfaces, which provide a way to organize and encapsulate code into logical units that can be reused across your module and even other modules.

Here's an example of using OOP to create a custom service for our "my_module" module:

  1. Create a new file called "src/MyModuleService.php" inside the "my_module" directory with the following contents:

This file defines a custom service class for our "my_module" module that returns a custom message.

  2. Update the "my_module_page()" function in the "my_module.module" file to use our new service:

This code retrieves an instance of our custom service using the Drupal service container and uses it to render the content of our page.

Step 4: Test and debug your module

Once you have developed your custom Drupal module using OOP principles, it's important to thoroughly test and debug it to ensure that it works as expected and doesn't introduce any bugs or security vulnerabilities into your site.

To test and debug your Drupal module, you can use a variety of tools and techniques, including:

  • Unit tests: Write automated tests for your module's functionality using PHPUnit or other testing frameworks.
  • Debugging tools: Use Drupal's built-in debugging tools, such as the Devel module, to debug your module's code and inspect its variables and data structures.
  • Code review: Have other developers review your code to identify potential issues and suggest improvements.

Conclusion

In this article, we've explored how to develop custom Drupal modules using object-oriented programming principles. By using OOP, we can create more maintainable, reusable, and testable code that is easier to understand and modify. We've also seen how to use OOP to create custom services and how to test and debug our custom Drupal modules. With these techniques, you can create powerful and flexible Drupal applications that meet your specific needs.

How to Add Dependency Injection in a Controller in Drupal 9

Dependency Injection is a design pattern that helps decouple the different components of a software application. It is a software design pattern that helps to manage the dependencies between different components in a software system. It involves passing the required dependencies into a class, rather than letting the class create or locate them itself. 

This pattern makes writing reusable, testable, and maintainable code easier. Decoupling the components of a system makes it easy to change or update any one component without affecting the others. In this blog, I will outline the process of creating and utilizing a custom service in Drupal 9 through dependency injection. 

Dependency injection is a technique where a client object relies on an injected object. It facilitates the flow of data between the two objects and enhances the overall modularity, testability, and scalability of the application. 

Dependency Injection has several benefits, such as: 

  • Improved maintainability: Dependency Injection makes it easier to change or update components without affecting the rest of the system.
  • Increased flexibility: Different components can be easily swapped out and replaced with others, which can be especially useful for testing.
  • Better scalability: Dependency Injection allows new components to be added easily as the application grows.

Dependency Injection can be implemented in different ways, such as using a constructor, a setter method, or an interface. The choice of method depends on the requirements of the specific use case, but the overall goal is to make the dependencies explicit and manageable.

Implementing Dependency Injection in Drupal 9

Recently, I have been working with services and dependency injection in Drupal 9. This process is similar to what was used in Drupal 8. Dependency injection provides a major advantage as it eliminates the need to constantly call the global container. Instead, we can simply inject the required services and events through dependency injection.

Services in Drupal 9 can be created using custom modules and can then be utilized on pages, controllers, blocks, and other components by using dependency injection.

In the below example, I have explained the connection between services and dependency injection in Drupal 9. I will also talk about how to call a custom service, which lists nodes based on the user ID passed in the URL, within a custom controller using dependency injection.

Services are used to reuse functionality such as database-related queries or sending emails. By using services, the same functionality can be utilized throughout the site after being defined in a single service file.

Step-Wise Guide on How to Add Dependency Injection in a Controller in Drupal 9

Let us go step by step to implement a service and invoke it via Dependency Injection in a Controller.

Step 1 - Establish a Custom Module within the Appropriate Directory

The first step is to create a custom module within the designated directory. This module should include an info.yml file that outlines the name and relevant details of the custom module.

 

Step 2 - Implement a Custom Service for Retrieving Node List Based on  User ID

To proceed, we will add a module_services.yml file, as illustrated in the image below. Within this file, we will specify the service class and its dependencies, such as the database argument in this case, as it involves querying the database to obtain the node list.

Next, we will place the service file within the designated directory, as follows:

/modules/custom/custom_service/src/GetDataServices.php

This is the location of the custom service file, which in this case is named GetDataServices.php and resides within the src folder of the custom module.

Step 3 - Integrate the Controller and Router within the Custom Module

This step involves adding the necessary code to the controller, which allows us to utilize the service from within the controller. The following code demonstrates this implementation.

The central aspect of this implementation is the utilization of the $container object, which offers a single method, "Get", as follows:

$container->get('');

To commence, we will declare a variable, referred to as $nodedata.

Subsequently, we set the value of $container with the following line:

$container->get('custom_service.get_data_user_node')

This specifies the name of our custom service, custom_service.get_data_user_node, which will be instantiated in the backend.

To access any function within the custom service, we first need to retrieve it using the following line:

 

$service = \Drupal::service('custom_service.get_data_user_node');

But we are calling the Dependency injection so we just inject our service like : $this->nodeData.

Finally, we can call the desired function, in this case the, "drupalise($id)" function, by using the following line:

$all_node = $this->nodeData->drupalise($id);

This function, "drupalise($id)," retrieves the node list based on the User ID argument passed.

Step 4 - Verifying the Controller Routing Page

The routing page of the controller can be accessed by passing the User ID in the URL. The data related to the user ID will be displayed on the page. The functionality of the page, such as filters and sorting, can be enhanced by adding the necessary code in the service file.

In this instance (Fig. 1), a simple listing query has been included and the result is presented in a tabular format with headers and rows. The controller function returns this table with the listing of Uid : Node id of that user, Title , and Node Type.

Dependency Injection Drupal 9

This serves as an illustration of how to access the first service from the container in Drupal 9 using dependency injection. This approach can be applied to call both Drupal core services and custom services.

Conclusion

To take advantage of the full capabilities of the Drupal 9 platform and to simplify your custom module development process, you should consider utilizing dependency injection in your controllers.

This approach allows you to leverage the power of custom services and streamline the integration of your desired functionality into your website.

If you are looking to improve your Drupal application’s performance and efficiency, or Drupal development needs, reach out to us



Drupal 9 End is Near: Upgrade with Dependency Injection to Drupal 10!

 

How to Conduct a Drupal Security Audit: Summary of Modules and Libraries

Drupal Security Audit is a systematic evaluation performed by authorized individuals or teams or tools to identify potential security weaknesses in a system or website. The audit encompasses a comprehensive range of activities, including code analysis of the core, plugins, and modules, configuration assessments, evaluations of business logic errors, and more. The goal of the audit is to identify any vulnerabilities and provide recommendations for remediation to ensure the website's security.

Importance of Undertaking Drupal Security Audit and Penetration Testing

Drupal sites are susceptible to threats such as Cross-Site Scripting (XSS), Denial of Service (DoS), Code Execution, SQL Injection, HTTP Response Splitting, and others. Small and medium-sized businesses are the most vulnerable, with 43% of data breaches targeting this segment.

Hence, investing in a comprehensive security solution, such as Drupal Security Audit and Penetration Testing, is a wise choice because it helps to identify potential vulnerabilities and provides an opportunity to fix them before they can be exploited by cybercriminals.

In this blog, we shall concentrate on providing an overview of the specific Drupal module versions used to conduct Drupal security audit, as well as the relevant PHP and JavaScript libraries employed during the Drupal Site Audit (Fig. 1).

Drupal Security Audit: Summary of Modules and Libraries

Evaluating the Versions of Installed Drupal Modules

Drupal offers a view that displays all installed modules and provides information on their update status, including the presence of any security fixes in the latest version.

In the context of Drupal, information regarding potential security flaws in a module is made public once the author releases a patched version. While the author may attempt to conceal the exact code changes made to address the security issue, this only serves to prolong the time an attacker requires to find and exploit the vulnerability. Given the significance of time in such situations, it is imperative to keep track of security updates on a regular basis, not just during a Drupal security audit.

At Valuebound, we strongly advocate for the regular updating of all available modules. The presence of security fixes in a module update is critical in maintaining the robustness and security of the application.

Updating Drupal Modules with Patches

When updating Drupal modules, it is imperative to verify if a patch has been applied to a specific module. In such scenarios, we follow these steps:

  • Examination of the origin of the patch: Our first step involves checking if the patch was created by the Drupal community and if it addresses a specific issue reported on drupal.org. If so, Valuebound’s Drupal Site Audit tool investigates the corresponding issue that the patch addresses.
  • Latest Version of the Module: If the patch has been integrated into a newer version, we recommend updating the module and removing the patch. The code that addresses the security flaw or adds the required functionality is already present in the official, updated version of the module.
  • Updating and Testing: If the patch has not yet been incorporated into the latest version of the module, we recommend updating and testing the updated version of the patch.
  • Custom Project Code: In cases where the patch is not a product of the Drupal community but is instead the result of project-specific work, updating the module is still recommended. However, the responsibility of ensuring the correct operation of the patch rests with the individuals responsible for the custom project code.

After updating, it is essential to verify the functionality of the patch and introduce appropriate fixes, if required, to ensure its proper operation on the latest version of the module.

Examining PHP Libraries

In the next phase, the utilization of PHP libraries will undergo a comprehensive evaluation. This can be achieved by utilizing the "composer show" command or the "local-php-security-checker" package. The latter option is more advisable as it streamlines the process.

Drupal Composer Security Checker incorporates the security-checker package. However, the effectiveness of this module is limited, and the security-checker package itself has not been actively maintained since January 2021. As such, the "local-php-security-checker" package is the preferred option.

In the event that any security vulnerabilities are detected, it is recommended to promptly update the relevant library to maintain optimal security. Regular assessments of PHP libraries, similar to Drupal modules, should be integrated into a comprehensive security program.

Evaluation of JavaScript Libraries

The subsequent step in the process entails a comprehensive assessment of the utilized JavaScript libraries to verify their current status and the presence of security fixes. This can be achieved by conducting an inspection of both the library directory and the relevant package.json files.

For the library directory, a manual review of the version is required. On the other hand, the npm-audit command can be used to analyze the package.json files. The npm-audit command provides a comprehensive report of all identified vulnerabilities, including the threat level, the affected packages and dependencies, the package path, and a link to additional information about the vulnerability.

In the event that a vulnerability is detected, it is recommended to promptly perform an update. Regular scans of the JS libraries are encouraged and should be conducted more frequently than a full security audit.

Conclusion

Acquiring the information presented in this article represents a simple and effective method for enhancing the security of your application.

The first step in a comprehensive security audit, conducted by our team of Drupal experts at Valuebound through the Drupal Site Audit Tool, involves reviewing the versions of the solutions in use. Our team highly recommends regularly checking for updates, and promptly updating whenever a security patch becomes available.

For those seeking assistance with a comprehensive Drupal security audit to assess readiness for Drupal 10, reach out to us.

WhatsApp integration in Web Applications

In the age of digital communication, businesses are constantly searching for new and effective ways to reach their customers. With the popularity of WhatsApp, it’s no surprise that businesses are now exploring the option of integrating the app into their web applications.

WhatsApp integration provides businesses with a convenient and cost-effective way to communicate with customers, improve customer service, increase engagement, and reach a wider audience. In this blog, we will explore why WhatsApp integration in web applications is an important tool for businesses to consider, and how can they do it.

How to integrate WhatsApp into Web Applications?

Integrating WhatsApp into a web application can seem like a daunting task, but it is actually relatively straightforward. By using the WhatsApp Business API, developers can create a connection between the web application and WhatsApp, allowing for seamless communication between the two platforms.

The process typically involves obtaining a token from Wati.io, configuring the API settings, and integrating the API into the web application code. Once the integration is complete, businesses can start using WhatsApp to communicate with customers, send notifications, and respond to customer inquiries.

With the right tools and resources, integrating WhatsApp into a web application can be a smooth and efficient process, helping businesses to improve their communication with customers. In the sections below, we will guide you through a step-wise process of integrating WhatsApp into web applications.

How to integrate WhatsApp into Web Applications

Technical Implementation:

1. Sign up for Wati.io at https://app.wati.io/  
2. Obtain an Access Token to access the Wati API's server.  
    Example: you will receive a live server link, similar to https://<server>.wati.io/index.html.  
3. To send WhatsApp messages, create a template.  
Example: Navigate to https://app.wati.io/messageTemplate, click on "New Template Message".

You can either create a template from scratch or use an existing template. Add dynamic variable names to the template, which can be sent via the API service. See the template below for reference (Fig.1).

Creation of Template message in wati.io

4. For API documentation, review the Developer documentation, which is available in multiple programming languages including C, C++, Python, Go, and others (Fig. 2).

Developer Api's for wati.io

5. For detailed information on the API, refer to the reference documentation available at https://docs.wati.io/reference/introduction.

6. To access the available API services, navigate to the live server and authorize it using the Access Token generated in step 2 (Fig. 3).

API authorization

Find the Swagger documentation for the sendTemplateMessage request body below.

Body Parameters (Fig. 4):

template_name : Template created in wati.io to send message to end users

Broadcast_name : Broadcast name created while creating the template

Parameters : Input variables for templates

Api for sending whats-app message

7. We can now utilize the API in our application to send messages to end-users.

Example: The following Python code snippet demonstrates the use of the sendTemplateMessage API, incorporating body parameters such as the buyer_number, country_code, content:

The above function can serve as a useful tool for sending messages within the application.

Conclusion

With Wati.io's WhatsApp Business API, developers can easily set up a connection between their web application and WhatsApp. The API offers a sendTemplateMessage function to help you send messages effortlessly within your application. Upgrade your communication game today with a seamless WhatsApp integration! If you have any questions regarding this, drop us a message and we will answer shortly. 

Download the Drupal Guide
Enter your email address to receive the guide.
get in touch