LATEST FROM OUR BLOG

Take your daily dose of (only) relevant news, useful tips and tricks and valuable how to's on using the latest web technologies shaping the digital landscape. We're here to do all the necessary information sifting for you, so you don't have to, to provide you with content that will help you anticipate the emerging trends about to influence the web.

How Do I Optimize My Website for Voice Search in 2019? 4 Web Design and Content Planning Tips
Is your website adapted to... lure in and greet voice searchers? It should, considering that there are a ton of stats showing that by 2020 30% of online searches won't even... involve a screen anymore. Voice searches are (already) taking over text-based searches. So, the question “haunting” you right now must be: “How do I optimize my website for voice search in 2019?" For, what grew as a mega-trend in 2018 — no less than 1 billion voice searches performed in January alone — will turn into reality this year. And there's no surprise here. It's just... convenience at its best:   no hands, not even a screen are required spoken language over a lot more formal, rigid written language   Now, getting back to your legitimate concern — how to get your website voice search-friendly — here are the web design and content creation/planning best practices for voice search optimization. The 2019 guide version...   1. Put the Most Sought After Information at the Very Top OK, here's the situation: User “X” has opted to use his/her search voice gadget or voice assistant to make an online query. This can only mean 2 things:   that he/she wants to skip all the steps that a text-based search would require — all that clicking and scrolling — and take the shortest path to find the needed information that he/she looks for a specific piece of information or wants to perform a specific action   And I don't mean just making a call. For instance, here's the next most sought after information or “want to perform" actions where users would use voice search instead of text:   to make an appointment to get information about any current sales, promotions and special offers (e.g. free shipping offers) to find out what are the opening hours of a given brick-and-mortar store... to get information about upcoming events   How do you prepare your website for voice search from this standpoint?  You put the most commonly sought after information in the header! So potential customers can... “grab” it as soon as they've uttered their voice queries. For instance, you could display snippets of information in the navigation bar...   2. Use Conversational Phrases and Long Tail Voice-Oriented Keywords “How do I optimize my website for voice search in 2019?” A short answer would be: By “sprinkling” conversational, long-tail keywords on your web content. By focusing your SEO efforts on phrases, even whole sentences. For, let's face it: The spoken language is clearly different from the written language. Voice queries have nothing to do with the “stiff”, standard keywords that we'd use for performing a text-based search.  In this respect, use voice-oriented keywords and phrases/sentences in your featured snippets, in your metadata... 3. “How to Optimize My Website for Voice Search in 2019?” Localize Content In other words: optimize for local voice search. And it's no “mystery” here: 46% of voice searchers look for information on businesses in their geographic area. Just put yourself in their shoes: It's far more likely that you utter “Where can I eat the best pasta in New York” compared to “Where can I eat the... in USA?” So, make sure you localize the content on your website. Meaning that you:   use verbiage and colors that resonate with those locals use visuals specific to that region include the name of that city/region (don't forget about your metadata) tag your images and video content with the name of that city/region put together location-specific pages on your website   In short, local voice search optimization is made of all those efforts geared at helping your website rank high in the voice search results. Where the voice searches are based on “... near me” or “... in [name of location]” type of queries. A piece of advice: optimizing your website for local voice search also means keeping critical information about your business —  opening hours, location, updated contact number(s) — up to date and most visible in your profile. Also, do consider creating content around business profile-relevant keywords, like “best Italian restaurant” or more specific ones: “the best carbonara pasta”.    4. Anticipate The Most Frequently Asked Questions and Create Content Around Them Another top answer to your “How to optimize my website for voice search in 2019” type of question would be: Creating content answering those specific voice queries that your potential customers are most likely to perform. And how do you anticipate those most frequently asked questions?  You rely on powerful tools like Answer the Public and, if your website's old enough, you dive into your Google Analytics data. There, under Acquisition > Search Console > Queries you'll find plenty of valuable information to explore and “exploit”. Once you know what the most common queries are, start creating your targeted content:   write quality blog posts around the answers to those “popular” questions  remember to insert those highly relevant long-tail keywords in your metadata put together a detailed FAQ page on your website place the answers to those frequently asked questions in featured boxes; this way, they'll just “stand out”, so users won't need to scan your entire website to get them … also, once/if marked properly, users don't even need to access your website: the featured snippet, including the answers to their queries, will already show up in the voice search results   Final Word  “How do I optimize my website for voice search in 2019?” By adapting the navigation & search on your website to this new reality: users... using their voices to search online. And that doesn't mean getting your website to “talk back” to its visitors. There are voice assistants and conversational UIs for that. Instead, focus your efforts on: Localizing and, overall, creating voice-search friendly content that should provide quick, accurate, specific answers to users' anticipated voice queries. ... Read more
Adriana Cacoveanu / Feb 15'2019
Easy Page Speed Audit: How to Improve the Perceived Performance of Your Drupal Site
How do you run a page speed audit from a user experience standpoint? For, let's face it: website performance is user experience!  What are the easiest and most effective ways to measure your Drupal website's performance? What auditing tools should you be using? How do you identify the critical metrics to focus your audit on? And, once identified, how do you turn the collected data into speed optimization decisions? Into targeted performance improvement solutions... Also, how fast is “ideally fast”, in the context of your competition's highest scores and of your users' expectations? Here are the easiest steps of an effective page performance audit, with a focus on the prompt actions you could take for improving it.   1. Front-End vs Back-End Performance They both have their share of impact on the overall user experience: Long response times will discourage, frustrate and eventually get your website visitors to switch over to your competition.   Front-End Performance  It's made of all those elements included in the page loading process, as being executed by the browser: images, HTML, CSS and JavaScript files, third-party scrips... The whole process boils down to: Downloading all these elements and putting them together to render the web page that the user will interact with.   Back-End Performance  It covers all those operations performed by your server to build page content. And here, the key metrics to measure is TTFB (Time To First Byte). It's made of 3 main elements:   connection latency connection speed the time needed for the server to render and serve the content   2. What Should You Measure More Precisely? 5 Most Important Metrics What metrics should you focus your page speed audit on? Here's a list of the 5 most relevant ones:   a. Speed index The essential indicator that will help you determine the perceived performance on your Drupal website: How long does it take for the content within the viewport to become fully visible? When it comes to optimization techniques targeting the speed index, “battle-tested” techniques, like lazyloading and Critical CSS, are still the most effective ones.   b. Time to first byte As previously mentioned, the back-end performance: Measures the time passed from the user's HTTP request to the first byte of the page being received by the browser.   c. Start render The time requested for rendering the first non-white content on the client's browser. Note: the subsequent requests are “the usual suspects” here, so you'd better ask yourself how you can reduce, defer or relocate them. Maybe you'd consider a service worker?   d. Load time How long does it take for the browser to trigger the window load event? For the content on the requested page to get loaded? Note: consider enabling HTTP/2, with a dramatic impact on individual page requests.   e. Fully loaded It measures the time of... zero network activity. When even the JavaScript files have all been already fired. Note: make sure your third-party scripts are “tamed” enough. They're the main “responsible” factors for high fully loaded times.   3. How to Perform a Page Speed Audit: 5 Useful Tools Now that you know what precisely to analyze and evaluate, the next question is: “How do I measure these key metrics?” And here are some of the easiest to use and most effective tools to rely on when running your page performance audit:   WebPageTest PageSpeed Insights Lighthouse SpeedCurve Chrome DevTools   Use them to:   collect your valuable data on all the above-mentioned metrics get an insight into the page rendering process performed by the browser identify the “sore spots” to work on automate repeated page speed tests keep monitoring your website (SpeedCurve) across multiple devices and in relation to your competition's performance  get a peek into your web page's structure and into the process of downloading resources over the network (Chrome DevTools) 4. 3 Key Benchmarks to Evaluate Your Website's Performance So, now that you've got your “target metrics” and your toolbox ready, you wonder:  “What should I measure those metrics against?” And here, there are 3 major benchmark-setting processes to include in your page speed audit:   determine your competition: your current production site before its rebuild, your direct and indirect “rivaling” websites determine the key pages on your Drupal website: homepage, product listing page, product detail page etc. measure your competition's web page performance   5. Most Common Performance Bottlenecks & Handiest Solutions Here are the most “predictable” culprits that you'll identify during your page speed audit, along with the targeted performance-boosting measures to take:   Factors Impacting the Front-End Performance & Solutions a. Too many embedded resources Too many embedded stylesheets, JavaScript and images are an extra challenge for your page loading time. They'll just block the rendering of the page. Each connection setup, DNS lookup and queuing translates into... overhead, with an impact on your site's perceived performance. The solution: consider caching, minification, aggregation, compression...   b. Oversized files And images (stylesheets and JavaScript) sure are the main “culprits” for long response times on any Drupal website.  The solution: consider aggregating/compressing them, turning on caching, lazyloading, resizing etc.   c. Wrongly configured cache Is your website properly cached? Have you optimized your cache settings? Or is it possible that your Drupal cache could be broken?  If so, then it will have no power to reduce latency, to eliminate unnecessary rendering. The solution: look into your response headers, URL/pattern configuration, expiration and fix the problem cache settings.   d. Non-optimized fonts Your heavy fonts, too, might play their part in dragging down your website. The solution: consider caching, delivery, compression, and character sets.   In conclusion: do re-evaluate all your modal windows, third-party scripts and image carousels. Is their positive impact on the user experience worth the price you pay: a negative impact on your page loading time?         Word of caution on caching: Mind you don't overuse caching as a performance boosting technique. If there are serious back-end performance issues on your website, address them; using caching as the solution to mask them is not the answer. It works as a performance improvement technique on already working systems only.   Factors Impacting the Back-End Performance & Solutions And there are some handy, straightforward measures that you could take for addressing back-end performance issues, as well:   Consider optimizing the page rendering process directly in the CMS.   Upgrade your server's hardware infrastructure (e.g. load balancing, RAM, disk space, MySQL tuning, moving to PHP7).   Keep the number of redirects to a minimum (since each one of them would only add another round trip, which bubbles up to the TTFB).   Reconfigure those software components that are lower in the server stack (caching back-end, application container).   Consider using a CDN; it won't serve everything, plus it will lower the distance of a round trip.   Consider using Redis, Varnish.   6. Final Word(s) of Advice Here are some... extra tips, if you wish, to perform a page speed audit easily and effectively:   remember to run your audit both before and after you will have applied your targeted performance improving techniques grow a habit of tracking weekly results define the goal of your Drupal website performance test: what precisely should it test and measure and under which circumstances? … for instance, you could be analyzing your site's back-end performance only: the time requested for generating the most popular web pages, under a load of 700 concurrent visitors, let's say (so, you won't be testing connection speed or the browser rendering process) pay great attention to the way you configure your page speed audit system if you aim for accurate and representative results   The END! This is the easy, yet effective way of performing a website speed and optimization audit. What other tools and techniques have you been using so far? Photo by Veri Ivanova on Unsplash.  ... Read more
RADU SIMILEANU / Feb 14'2019
What Are the Best WordPress Cache Plugins for 2019? Top 5 Most Effective Ones for Speeding Up Your Website
Have you just launched your website and it got hit by an unexpected... “tsunami wave of traffic? Or maybe it's that crappy web host that couldn't back it up? Or is your WordPress website a few years old already? And has it grown by now into this heavy block of content and ecosystem of plugins dragging it down? Or you're considering switching your website to WordPress and you're concerned about the fluctuations in the page loading speed? No matter which one of these scenarios fits your own, now you must be wondering: “What are the best WordPress cache plugins for 2019?” For, there sure are many, both paid and free. And almost every one of them has its own “fan club” of developers and WordPress website owners. But does “the most popular” also mean the most effective for your own theme and setup? Now, to free you of the burden of evaluating dozens of highly-recommended caching plugins for WordPress, we've done it for you. The result? A shortlist of 5 WP cache plugins with the highest scores at successive speed tests.   But First: What Is a Caching Plugin? And Why Do You Need It? Here's a “non-WP cache plugin for WordPress” scenario: A user accesses a page on your WordPress website. Then a whole “madness” of PHP code executions and database queries for retrieving data goes on “behind the curtains”. And this process — to generate web page content dynamically — is being performed at the cost of page loading speed. Now, if the same user accesses your website after you've integrated it with one of the best WordPress cache plugins for 2019, here's what happens: The caching plugin will have turned that page from a dynamic into a static HTML page. Its content (written text, plus other page elements that don't need to be re-loaded every single time) is already saved and copied on the server, in a cache folder. And so, it gets served in an instant. No more time-consuming database queries to retrieve the required data. No more code executions in the background for displaying that page. A bit more clear now why you need a WordPress caching plugin? Why it becomes both the handiest and the most critical tool in your “performance tuning” emergency kit? Summing up: It's enough for a page on your website to be accessed just once. Then, your cache plugin will instantly create a static version for it. From then on, each time a visitor accesses that web page, he/she will be served its static version. It will no longer be dynamically generated. With a huge impact on your web page's loading time.   1. W3 Total Cache A plugin that starts caching right out of the box.  Just install it and... that's it. No need to work your way through pages of settings to turn on its core functionality. It comes full-featured by default:   minification and GZIP compression support object/browser/page cache (and so on) AMP and SSL support CDN support support for importing attachments straight into the media library   Still, to be 100% sure that it works at full capacity right from the start:   access the General page turn on the “Toggle all caching types” option   Does it help to know that high performing websites like Web Designer Depot, Mashable and Smashing Magazine have this caching tool plugged in? Or that it boasts over 1 million active installs?   Main drawbacks Things get a bit... overwhelming (especially for newbies) when it comes to custom-tuning its functionality to suit specific caching needs. Let's say that you want to update the default life of the cached data. And I'm taking here about no less than 16 settings pages, with tons of customization options for you to scan through. There's one for every type of caching (page, database, browser etc.)    2. Comet Cache, One of the Best WordPress Cache Plugins for 2019 Another one of those “install and run” type of caching plugins. Simple set up and ease of use. Some of its specific features, compared to other plugins, are:   the use of snapshots for speeding up the reading serving cached content only to non-logged in visitors and to those who haven't submitted a comment recently accompanying each one of its configuration settings by detailed explanations   Note: do keep in mind that its free version will provide you with basic features only; for more advanced ones you'll need to upgrade to the premium version.   Main drawbacks Having to pay for its pro features and its whole “network” of configuration options might discourage some of the users.   3. WP Super Cache Free, “notorious”, highly vetted, with a simple set up, and overloaded with customization options.  This is the recipe behind the best WordPress cache plugins for 2019 and WP Super Cache is one holding all the “ingredients”. And when I say “simple set up”, I think of its Options page with no more than 7 tabs. Being basically pre-configured already, you'll only need to:   go to "Easy" tab and enable caching keep monitoring your cached pages in the “Contents” tab   It's built a reputation of serving static content to 99% of your site's visitors. And it relies on PHP and mod_rewrite for that. “What does WP super cache do?” Its built-in features range from:   cache pre-loading to content delivery networks support REST API endpoints enabling you to access the settings GZIP compression dynamic caching caching for mobile users to scheduler for clearing the cached pages    In case you want to tune its performance, you can always go to “Advanced Settings” and enable more caching features like:   compressing files “Don't cache pages for known users”   Main drawbacks The fact that it doesn't deliver static files to logged in users and that it's not fully compatible with some WP themes might restrain some from using it.   4. WP Rocket Not just one of the best WordPress cache plugins for 2019, but one of the most beginner-friendly, as well. And one of the plugins that come with a price tag on... All it takes for you is to activate it and... you're all set. Its crawler will instantly start fetching your web pages to set up the cached files. It will also turn on all the default caching features such as:   page cache cache-preloading GZIP compression   No need for you to manually enable them. As for its optional features, I would mention:   lazy loading images DNS pre-fetching minification CDN support   As already mentioned, the plugin triggers lazy images loading, meaning that images on your WordPress website get downloaded as they're being scrolled down. Not in advance. And this particular feature alone is already powerful enough to speed up your page loading times dramatically. Especially if you have lots of images on your web pages. Its Settings tab is a 7-section area that's not even close as intimidating as W3 Total Cache's one.  In fact, there's only one reason for using the Advanced Options tab: To select the files and the pages that the plugin shouldn't minify and cache.   Main Drawbacks The obvious one: it doesn't have a free version.   5. WP Fastest Cache  If you're looking for a... minimalist, yet efficient caching plugins, this might just be the one. Fewer customization options might translate as fewer risks to get tangled up in configuration settings. You get to grips with it within minutes. To give you an idea: There's only one settings page, divided into 3 tabs: display settings, delete cache and minified files and set up the rate for deleting the cached files. “And how does it work?” It uses mod_rewrite to set up static files on your WordPress website. Now, don't think that less tweaking options means less critical core features. On the contrary. Out of the box, the plugin provides you with:   compression browser caching minification options for pairing CSS with JavaScript files SSL and CDN support cache timeout for certain pages   Simplicity and efficiency at its best! Just click the corresponding checkbox and enable the feature you need.   Main drawbacks It doesn't support WordPress Multisite. The END!  These are, according to the speed tests performed on them and the no. of active installs, the best WordPress cache plugins for 2019. Is the one you've been using on this list?   ... Read more
RADU SIMILEANU / Feb 08'2019
How to Send Richly Formatted HTML Emails in Drupal 8: Deliver the Experiences that Your Customers Expect in 2019
API first, responsive Bartik, headless and decoupled Drupal, Layout Builder, React admin UI... Drupal's evolved tremendously over these 18 years! Yet: the emails that we send out via its otherwise robust email sending system aren't different from those we used to send a... decade ago. And customers expect rich experiences outside your Drupal website or app. While website administrators expect to be enabled to easily manage, via the admin UI, their email content templates. So: how do you send HTML emails in Drupal 8? Without relying on external services, of course... And who could blame customers for expecting 2019-specific user experiences? Experiences that HTML-enabled emails deliver through their great features. Features that support Drupal editors' marketing efforts, as well:   traffic-driving hyperlinks; you get to link to your landing page right from the email visually attractive custom design; emails that look just like some... microsites all sorts of design details that reinforce your brand: buttons over cryptic links, responsive design, templated footers and headers web fonts QR codes  hierarchical display of content, that enhances readability and draws attention to key pieces of content and links in your email images and attachments tracking for monitoring opens   And speaking of admin and/or editors, the questions they ask themselves are: “How can I easily theme the emails to be sent out?” “How can I change their content templates right from the admin UI?” And these are the questions that I'll be answering to in this post. Here are your current options at hand — 3 useful Drupal 8 modules — for easily crafting and sending out HTML emails that appeal and engage.   1. The HTML Mail Module  It does exactly what you'd expect: It enables you to configure HTML emails from Drupal 8. It's the Drupal 7 go-to option whenever you want to go from plain text emails to HTML-formatted ones. A module available for Drupal 8 in alpha version. Furthermore, it integrates superbly with the Echo and the Mail MIME modules.   2. The Swift Mailer Module, The Best Way to Send HTML Emails in Drupal 8 Swift Mailer is the highly recommended method for configuring Drupal 8 to send out visually-arresting, HTML emails. Since you can't (yet) send them right out of the box with Drupal... The module stands out as the best option at hand with some heavy-weighing features:   it supports file attachments it supports inline images, as well it enables admins to send HTML (MIME) emails … to send them out via an SMTP server, the PHP-provided mail sending functionality or via a locally installed MTA agent   Note: you even get to use this module in tandem with Commerce to send out your HTML-enabled emails. There's even an initiative underway for replacing Drupal's deprecated core mail system with the Swift Mailer library. And now, here are the major configuration steps to take to... unleash and explore this module's capabilities:   first, set up the Swift Mailer message (/admin/config/swiftmailer/messages) settings to use HTML next, configure the Swift Mailer transport settings (/admin/config/swiftmailer/transport) to your transport method of choice  and finally, configure the core mail system settings to use this module for the formatter and the sender plugins   And if you're not yet 100% convinced that the Swift Mailer module is significantly superior to Drupal's default mail system, here are some more arguments:   it enables you to send... mixed emails: both plain text and HTML-enabled it provides HTML content types it supports various transport methods: Sendmail, PHP, SMTP (the current mail system supports but one method) it enables you to integrate key services with Drupal —  like Mandrill, SendGrid —  right out of the box it incorporates a pluggable system, allowing you to further extend its functionality   How about now? Are these strong enough arguments that Swit Mailer's the way to send HTML emails in Drupal 8?   3. The PHPMailer Module Another option for configuring Drupal 8 to send out HTML emails is the PHPMailer module. How does it perform compared to Swift Mailer?   It's not pluggable it's not as easily customizable as Swift Mailer  it's already embedded in the SMTP module (in fact, in Drupal 8 the default mail interface class is named “PHPMail” instead of DefaultMailSystem)   What features does it share with Swift Mailer?   it enables you to send out HTML-enabled emails with Drupal it enables you to add attachments to your emails it, too, enables you to send out mixed emails it, too, supports external SMTP servers   Moreover, you can extend its core functionality by integrating it with the Mime Mail component module (currently in alpha 2 version for Drupal 8).   4. The Mime Mail Component Module Briefly, just a few words about Mime Mail:   as already mentioned, it's a “component module”, that can be used for boosting other modules' functionality it enables you to send out HTML emails with Drupal: your mail would then incorporate a mime-encoded HTML message body it enables you to set up custom email templates: just go to your mimemail/theme directory, copy the mimemail-message.tpl.php file and paste it into your default theme's folder; this way, your email will take over your website's design style  any embedded graphics gets Mime-encoded, as well, and added as an attachment to your HTML email do some of your recipients prefer plain text over richly formatted HTML emails? Mime Mail enables you to switch your email content over to plain text to meet their specific preferences   The END! Now that you know your options, it's time to step out from the (too) long era of rudimentary, plain emails sent out with Drupal. ... and into the era of richly formatted HTML emails, that will:   enrich your customers' experiences enhance Drupal 8 site admins' experience ... Read more
Adriana Cacoveanu / Feb 06'2019
How to Decouple Drupal Commerce to Deliver Richer Shopping Cart Experiences: Useful Modules
Just imagine it: Drupal 8's robust features as a CMS, the flexible e-commerce functionality of the Drupal Commerce ecosystem and a JavaScript framework for the front-end! All in the same native mobile app! You can easily achieve this “combo” — a reliable content repository & a JS-based front-end providing a fantastic shopping cart experience — if you just... decouple Drupal Commerce. For why should you trade Drupal's battle-tested content authoring and administration tools for a more interactive user experience?  And why should you give up on your goal to deliver richer cart experiences just because Drupal 8 can't rival the JavaScript in terms of advanced native mobile app functionality?   push notifications complex shopping options enabling users to manage their own delivery times and places ... to configure various aspects of their orders and so on   Just leverage a decoupled Drupal Commerce strategy in your shopping app project and you can have both:   Drupal as your secure content service  the front-end framework of your choice “in charge” with the user experience    In this respect, these are the most useful Drupal tools at hand for implementing an API-based headless architecture:   1. Headless Commerce Comes Down to... … separating your commerce stack (back-end content handling area, data store etc.) from the user interface. Or the “head”, if you wish. The presentation layer would “retrieve” content from the back-end content storage area and is the one fully “responsible” with delivering fantastic user experience. This way, you're free to choose your own front-end tools. Now, why would you consider choosing a decoupled architecture for your e-commerce solution? The benefits are quite obvious and not at all negligible:   higher flexibility and scalability (that JS frameworks are “famous” for) freedom to customize your app to your liking (for every platform or/and device) richer, more interactive shopping experiences    2. Decoupled Drupal Commerce... Out of the Box? The Commerce Demo  Narrowing our focus down to... Drupal, to Drupal Commerce, more specifically, the question's still there: “How do I decouple Drupal Commerce?” Considering that:   there are specific challenges that such a decoupled front-end architecture poses Drupal solutions like Forms API and Views won't fit your specific (probably quite complex) design implementation requirements   Luckily, the Commerce Guys team has already faced and solved these challenges. First of all, they've put together the Commerce Demo project, a store providing default content to be “injected” into Drupal. Secondly, their attempt at integrating a design meant to support advanced functionality, for richer shopping cart experiences, resulted in 2 new modules:   Commerce Cart API Commerce Cart Flyout   More about them, here below...   3. Useful Modules to Decouple Drupal Commerce  Here's a collection of the most... relevant modules that you could use in your headless Drupal Commerce project:   3.1. The Commerce Cart API Module It's no less than a handy Drupal tool that enables you to custom build your shopping cart widget.    3.2. The Cart Flayout Module The go-to module when you need to ajaxify the “Add to cart” form in your shopping app. Basically, what it does is: Provide a sidebar that “flies out” once the user clicks the “Add to cart” button or the cart block. If I were to dive into details a bit, I'd add that the flyout enables users to:   view the products in their shopping carts remove all the items there update the quantity of a specific item   Should I add also that Cart Layout comes with no less than 9 different Twig templates, for various parts of the module? By leveraging Drupal's library management feature you can easily override these JS segments of the module. And not only that you get to customize it to suit your needs entirely, but:   it comes with a well structured JS logic it's built on top of Backbone   … which translates into an efficient models-views separation.   3.3. Commerce 2 Use Drupal Commerce 2 as the core structure of your e-commerce project. Being an ecosystem of Drupal 8 modules and “spoiling” you with unmatched extensibility via its APIs, Drupal Commerce empowers you to implement all kinds of headless commerce scenarios. It enables you to use Drupal as your content/data (user and order-related info) repository and to easily serve this content to your mobile app. To your end-users.   3.4. The Commerce Recurring Framework Module Some of its handy charging & billing features include:   configurable billing cycles configurable retries in case of payment declines both prepaid and postpaid billing systems   3.5 The JSON API & JSON API Extras Modules    Need to decouple Drupal Commerce, to enable a full REST API in JSON format?  It's as easy as... enabling a module (or 2 at most): the JSON API module. What it does is:   Expose the API so you can vizualize the data in JSON format.   And Drupal's built and perfectly adapted to support JSON API, which turns it into the go-to option when you need a back-end content repository for your headless shopping app. In addition to this module, feel free to enable JSON API Extras, as well. It comes particularly handy if you need to customize the generated API.  It allows you to:   override the name of your resources change their path...   You'll then have a specific place in your app's user interface where you can visualize your content paths. Once you have your data in JSON format, safely stored in your back-end content creation & moderation Drupal area, you're free to... serve it to your mobile shopping app!   The END! And these are some of the already tested tools and techniques to decouple Drupal Commerce so that you can deliver richer, more interactive cart experiences. Have you tried other modules/methods? Writing custom JavaScript code... maybe? ... Read more
RADU SIMILEANU / Feb 01'2019
What Are the Best Node.js Frameworks in 2019 and Why? Top 5
The future is now... That predicted future where Node.js dominates the landscape of the application and web development technologies. And so, the “tormenting” question that you're dealing with right now must be: “But what are the best Node.js frameworks in 2019?” Followed closely by: “And which one of them should I use? Which one of these web server frameworks best fits my own project requirements?” And, as a Quora user pointed out: “This is just like asking what clothes to wear out. It depends on where you're going right?” To give you a hand, we've weighed the pros and cons, both the developers' and the end-users' reviews. We've compared their “stocks” of GitHub stars, and shortlisted the Node.js frameworks to... 5 frameworks holding a higher scope than the rest:   But First, What Is a Node.js Framework More Precisely? First of all, yet without getting knee deep into technical jargon, let's briefly pass in review the main reasons why Node.js — a tool for developing server-side web apps quick and easy — has got so influential: It enables developers to build fast and scalable server-side apps. And it all comes down to these 2 key benefits. All that talk about:   its innovative event-based I/O model about it being conveniently lightweight about single-threaded asynchronous programming   … can be reduced to these 2 “irresistible” advantages. And by “fast” I don't refer to page loading times only, but to the fact that it speeds up the development process itself, as well: With Node.js implementing the server side, developers don't need to “joggle with” 2 languages anymore. One for the back-end/server-side and one for the front-end/client-side. Now, back to the initial question: “What is a Node.js framework?” Take it as some sort of Node.js-based abstract design or “skeleton” that you can build your own custom code on. An... empowering “skeleton” that comes packed with:   a set of tools guidelines and best practices   … that help you/your development team quickly prototype and develop your project. And, since its out-of-the-box features help you keep code consistency throughout the team, a Node.js framework will implicitly:   boost your productivity enhance your app project's scalability   Does that answer your question?   1. Express.js It stands out as “the minimalist” framework in our list here: A Node.js-based technology that takes on the role of a middleware between our servers and routes. And its robust APIs is one of the main “culprits” for its increasing popularity — one of the best Node.js frameworks in 2019. It practically enables app developers to set up routes to send/receive requests between the database (MongoDB) and the front-end (Angular). Another one of its “selling points” is given by the heavy load of packages that you can just “inject” into the Express.js framework to extend its functionality.   Benefits:   low learning curve short app development cycle time ideally customizable mostly browser-focused, meaning that templating and rendering comes as a default feature  great 3rd party integration (Pug, EJS, Mustache and other template engines and modules available on NPM)   Drawbacks:   its code organization  event-driven callbacks (a type of architecture that “tempts” you with unmatched flexibility at the price of... unwanted complexity as your app scales up)   2. Meteor JS The key advantage that propelled Meteor in the 5 best Node.js frameworks in 2019? Real-time updating. And there's more! It's built to power really large projects (e.g. Reaction Commerce) and, if documentation is a particularly heavy-weighing criterion for you, this framework's backed by a large community. One that has already put together rich and clear documentation to help you get your web app up and running in no time.   Benefits:   real-time testing tool and debugging a wide range of libraries and packages to boost its core functionality with seamless client-server communication   Drawbacks:   there's no native widget library no MongoDB support … PWA support … or rendering on the server side, either   3. Sails.js, One of the Best Node.js Frameworks in 2019 The most... compatible Node.js framework in our list, we could say. For Sails.js “gets along well” with:   almost all databases most of the front-end technologies, as well (Angular, Android/Java, Backbone, React, iOS/Objective C) the great majority of adapters: Mongo, MYSQL, Local Disk, Redis, PostgreSQL   And it's not at all “picky” when it comes to the types of controllers, models, views, adapters, and configuration files that the applications that it powers might include. In short: it's a highly compatible framework with data-based APIs and service-oriented, scalable architecture. One that gives you a more... robust “skeleton” to start with, we might say.   Benefits:   it separates business logic from presentation logic it can store data anywhere it speeds up the Rest API building process no additional routing generates free JSON API good Socket.io support   Drawbacks:   it's one of the... slow Node.js frameworks time-consuming project development process poor asset management   4. Koa.js Developed by the same team that designed Express.js, Koa sets itself apart from the rest of the Node.js frameworks in our top here with some unique features:   it uses next-generation methods of ES6 that enables you to work without callbacks … and grants you more control when it comes to error handling there's no middleware, which means that the lines of code are more granular, the middlewares are more... component-based, more cascaded … thus granting you with increased control over your configuration   Why has the Express.js team decided to build a new Node.js framework? What have been their major goals:   to build a smaller sized framework compared to Express.js …. a more expressive one to provide developers with a more robust “scaffolding” for building their web apps and APIs on   Benefits:   easier to control error handling it's significantly lighter than other frameworks modular structure it gave up on callbacks and thus removed all the well-known asynchronous issues support for Sync/await keywords cascading middlewares   Drawbacks:   it's not compatible with express-style middleware, with Node.js middleware there isn't a large community to rely on for support   5. LoopBack.js One of the best Node.js frameworks in 2019 that “spoils” you with:   a dynamic API web browser  easy-to-use CLI    What makes it unique in our list here? The fact that it empowers developers to build their own models based on their own dynamic models or schemas. To come up with their own server API, that would be further assigned to a new server. Pretty much like building an API that's proxy for... another API. In addition to that, it supports a whole range of databases: PostgreSQL, MySQL, Oracle, MongoDB and REST services.   Benefits:   fast development cycle modular and structured code available add-on components for Oauth2, 3rd-party login, file management  support for browser and native mobile SDKs: iOS, Android/Java, JavaScript browser you can rapidly create dynamic end-to-end REST APIs    Drawbacks:   monolithic, opinionated architecture steep learning curve   Final Word  As already mentioned, at the beginning of this post: a mere inventory of the best Node.js frameworks in 2019 is not the answer.   It's the best web server framework for your own project's requirements that you need.   What are your priorities when it comes to the benefits that you “reap” from using one Node.js framework over the other? Is it:   top speed? fast development  high maintainability rich documentation and a thriving community backing it up?   Friendly advice: don't invest all your resources in learning one such Node.js framework since new, more tempting and feature-rich ones will emerge. Instead, learn the business in the front-end/back-end or the language itself (JavaScript) to future-proof your... investment. ... Read more
RADU SIMILEANU / Jan 31'2019
6 Best Serverless Plugins: How to Tailor the Serverless Framework to Your Project-Specific Needs
Build, configure and deploy all necessary resources with just a few commands... The serverless framework empowers you to streamline your entire development workflow. But what if you need to tackle some project-specific issues? Then you extend its core functionality to suit your needs by implementing the best serverless plugins available. For you might need to:   bundle a Lamba function with Webpack empty your buckets before removing them copy data from production to development table   So, what are your options?   to scan through the pile of already developed serverless plugins, looking for the one that addresses that specific issue to write your own custom serverless plugin   This post here focuses on the first option. I'll reveal to you the 6 most useful community-driven plugins for the serverless framework.   1. But First: What's the Core Functionality of the Serverless Framework? In other words: What do you get out-of-the-box? Here's a short list of tasks that go from being manually carried out to... automated when you go serverless:   creating, configuring, and deploying the needed resources (API Gateway and Lambda functions)  storing your code (and configuration) into a repository for later use setting up database tables for your functions configuring serverless templates for your subnets and VPC's   In other words: using a serverless framework streamlines all those tedious tasks of writing code on the console, configuring your resources, managing your team's workflow...   2. 6 Best Serverless Plugins to Consider for Your Next Project  And the serverless framework itself is an “ecosystem” of plugins.  Nevertheless, there are cases when its core functionality doesn't meet all your project's requirements and you need to... extend it.  Before you rush to write your own plugin, you might want to have a look at what's already been built. In this respect, here's a list of the most widely used ones:   2.1. Serverless Webpack In a situation where you need to bundle your lambda functions with Webpack? Let this serverless plugin here handle the job for you.   2.2. Serverless Dotenv  Here's a common scenario: You need to load your variables, currently stored in an env file, into your serverless yaml config.  Then, this is the serverless framework plugin that comes to your rescue. It enables you to dynamically preload env files into serverless.   2.3. Serverless Offline  Need to run everything on your local machine before you deploy it? Integrate this plugin here into your framework and it will emulate AWS Lambda and API Gateway on your PC, streamlining your whole development process.   2.4. Serverless Mocha Plugin  One of the best serverless plugins, a mocha-based one, that provides you support for your test-driven development flow.   2.5. Aliyun Function Compute  Is “injecting” Alibaba Cloud Function Compute support into your serverless app one of your project-specific needs? Well, then this is the plugin you need! It's been built to enable support for this event-driven compute service into the serverless framework.    2.6. Serverless S3 Remover  What do you do with all those buckets that you will have been “joggling” with once you decide to delete your stack? The one you will have “overly exploited” by then, during your tests? Well... you remove them. Along with the content that they store.  How? You let this plugin here handle the “decluttering task” for you. The END! These are the 6 best serverless plugins already available that you can implement into your projects.  Which one's the perfect fit for your current project-specific needs? Photo from Unsplash ... Read more
RADU SIMILEANU / Jan 19'2019
How Do You Deal with Duplicate Content in Drupal? 4 Modules to Get this Issue Fixed
Accidentally creating duplicate content in Drupal is like... a cold:  Catching it is as easy as falling off a log. All it takes is to:   further submit your valuable content on other websites, as well, and thus challenging Google with 2 or more identical pieces of content move your website from HTTP to HTTPs, but skip some key steps in the process, so that the HTTP version of your Drupal is still there, “lurking in the dark” have printer-friendly versions of your Drupal site and thus dare Google to face another duplicate content “dilemma”   So, what are the “lifebelts” or prevention tools that Drupal “arms” you with for handling this thorny issue? Here are the 4 modules to use for boosting your site's immunity system against duplicate content. And for getting it fixed, once the harm has already been made:   1. But How Does It Crawl into Your Website? Main Sources of Duplicate Content  Let's get down to the nitty-gritty of how Drupal 8 duplicate content “infiltrates” into your website. But first, here are the 2 major categories that these sources fall into:   malicious non-malicious   The first ones include all those scenarios where spammers post content from your website without your consent. The non-malicious duplicate content can come from:   discussion forums that create both standard and stripped-down pages (for mobile devices) printer-only web page versions, as already mentioned items displayed on multiple pages of the same e-commerce site   Also, duplicate content in Drupal can be either:   identical or similar And since it comes in “many stripes and colors”, here are the 7 most common types of duplicate content:   1.1. Scraped Content Has someone copied content from your website and further published it? Do not expect Google to distinguish the copy from its source. That said, it's your job and yours only to stay diligent and protect the content on your Drupal site from scrapers.   1.2. WWW and non-WWW Versions of Your Website Are there 2 identical version of your Drupal website available? A www and a non-www one? Now, that's enough to ring Google's “duplicate content in Drupal” alarm.   1.3. Widely Syndicated Content  So, you've painstakingly put together a list of article submission sites to give your valuable content (blog post, video, article etc.) more exposure. And now what? Should you just cancel promoting it? Not at all! Widely syndicated content risks to get on Google's “Drupal 8 duplicate content” radar only if you set no guidelines for those third-party websites. That is when these publishers don't place any canonical tags in your submitted content pointing out to its original source. What happens when you overlook such a content syndication agreement? You leave it entirely to Google to track down the source. To scan through all those websites and blogs that your piece of content gets republished on. And often times it fails to tell the original from its copy.   1.4. Printed-Friendly Versions This is probably one of the sources of duplicate content in Drupal that seems most... harmless to you, right? And yet, for search engines multiple printer-friendly versions of the same content translates as: duplicate pages.   1.5. HTTP and HTTPs Pages Have you made the switch from HTTP to HTTPs? Entirely? Or are there:   backlinks from other websites still leading to the HTTP version of your website? internal links on your current HTTPs website still carrying the old protocol?   Make sure you detect all these less obvious sources of identical URLs on your Drupal website.   1.6. Appreciably Similar Content  Your site's vulnerable to this type of duplicate content “threat” particularly if it's an e-commerce one. Just think of all those too common scenarios where you display highly similar product descriptions on several different pages on your eStore.    1.7. User Session IDs  Users themselves can non-deliberately generate duplicate content on your Drupal site.  How? They might have different session IDs that generate new and new URLs. 2. 4 Modules at Hand to Identify and Fix Duplicate Content in Drupal What are the tools that Drupal puts at your disposal to detect and eliminate all duplicate content?   2.1. Redirect Module Imagine all the functionality of the former Global Redirect module (Drupal 7) “injected” into this Drupal 8 module! In fact, you can still define your Global Redirect features by just:   accessing the Redirect module's configuration page clicking on “URL redirects”    Image Source: WEBWASH.net What this SEO-friendly module does is provide you with a user-friendly interface for managing your URL path redirects:   create new redirects identify broken URL paths (you'll need to enable the “Redirect 4040” sub-module for that) set up domain level redirects (use the “Redirect Domain” sub-module) import redirects   Summing up: when it comes to handling duplicate content in Drupal, this module helps you redirect all your URLs to the new paths that you will have set up. This way, you avoid the risk of having the very same content displayed on multiple URL paths.   2.2. Taxonomy Unique Module   How about “fighting” duplicate content on your website at a vocabulary level? In this respect, this Drupal 8 module:   prevents you from saving a taxonomy term that already exists in that vocabulary is configurable for every vocabulary on your Drupal site allows you to set custom error messages that would pop up whenever a duplicate taxonomy term is detected in the same vocabulary   2.3. PathAuto Module   Just admit it now: How much do you hate the /node125 type of URL path aliases? They're anything but user-friendly. And this is precisely the role that Pathauto's been invested with: To automatically generate content friendly path aliases (e.g. /blog/my-node-title) for a whole variety of content. Let's say that you want to modify the current “path scheme” on your website with no impact on the URLs (you don't want the change to affect user's bookmarks or to “intrigue” the search engines). The Pathauto module will automatically redirect those URLs to the new paths using any HTTP redirect status.   2.4. Intelligent Content Tools       Personalization is key when you strive to prevent duplicate content in Drupal, right?  And this is precisely what this module here does: it helps you personalize content on your website. How? Through its 3 main functionalities delivered to you as sub-modules:   auto tagging text summarizing  detecting plagiarized content    Leveraging Natural Language Processing, this last sub-module scans content on your website and alerts you of any signs of duplicity detected. Word of caution: keep in mind that the module is not yet covered by Drupal's security advisory policy!   3. To Sum Up Setting a goal to ensure 100% unique content on your website is as realistic as... learning a new language in a week.  Instead, you should consider setting up a solid strategy ”fueled” by (at least) these 4 modules “exposed” here. One that would help you avoid specific scenarios where entire pages or clusters of pages get duplicated. Now, that's a far less utopian goal to set, don't you think? ... Read more
Adriana Cacoveanu / Jan 16'2019
10 Reasons Why AI Projects Fail or How You Can Easily Sabotage Your Own AI Project- Part 2
And I'm back, as promised, with a handful of reasons — ranging from “the usual suspects” to more nuanced ones — why AI projects fail. From:   getting too absorbed in keeping your technological assets up to date to the point of skipping to put together a solid business strategy for your AI implementation to getting overly excited about AI and trying to “force integrate” it into... everything  to skipping to further maintain it, once launched   … there are quite a few mistakes that you can easily avoid and thus foolproof your AI project. So, let me expose these hidden “traps” to you:   Mistake #6: You Put Technology Before a Solid Business Strategy AI-powered or not, it's still a... business that you're running, right? So, getting focused on technology only, turning it into the unique driver of “business” value is simply... non-realistic. First, you need to build your solid business strategy. One to include:   thorough research of your target markets all the technological assets needed to reach your AI project's goal ... along with all the resources to be invested, of course   Technology, no matter how advanced, never comes before business strategy.  That, of course, if it's business value that you try to achieve and not just... building AI for AI's sake.   Mistake #7: You Cut Down on Testing Time Probably one of the most common reasons why AI projects fail: You get all too eager (and over-confident) to release your AI-powered software out into the wild and you deliberately skip some major debugging phases. To avoid this trap, make sure to include, while setting up your business strategy, the due resources for properly testing your AI project before “setting it free”. For, placing it into the spotlight prematurely, faulted and vulnerable to future bugs, will “doom” your AI solution to years of... public distrust.   Mistake #8: You Get Stuck in a Never-Ending Development Cycle Now, mind you don't avoid a pitfall only to... fall into the next one: A never-ending design-develop-design-develop... process. For, yes, one of the worst AI mistakes is to release a buggy, poorly tested AI-enabled software product.  But it's equally risky to keep postponing its launch and get tangled up in this loop of continuously polishing it and testing it. You just risk having your competition leverage all the AI opportunities out there while you're constantly updating your software. Instead, consider launching the best possible version of your AI software. Then, collect the relevant data and the message coming from your target market to iterate and release an updated version.   Mistake #9: Baking AI into Everything- Why AI Projects Fail Trying to turn AI into an “all-purpose” tool is yet another frequent mistake behind many AI fails. I know you must be infatuated with AI (we, too, are infinitely excited with the still unexplored opportunities of artificial intelligence). Yet, do keep in mind that the right sequence is the following: You first identify the specific need/problem in the market and then come up with the suitable AI solution for it! You don't just jump on the latest AI technology and... force-fit it into any software product. For, let's face it: There are tasks where AI rocks and tasks where human staff's emotional intelligence is needed (take certain customer service scenarios, for instance). So, don't try to bake AI into... everything or your project will only swell the ranks of failed AI projects.   Mistake #10: You Skip Further Maintaining Your AI Solution A “launch and run” strategy won't propel your AI project too far ahead... That is: Just like any other product, an AI-powered software product needs periodical maintenance. Regular “infusions” of new methods, new models and training data.   The more complex it gets, the more crucial a solid maintenance strategy becomes. So, mind you do not underrate this phase. It's another too common reason why AI projects fail.   The END! These are the 10 most “popular” AI project mistakes. Which one(s) had you been more “vulnerable” to before seeing them all exposed in this post here? Photo by Rock'n Roll Monkey on Unsplash.  ... Read more
Adriana Cacoveanu / Jan 14'2019