Development today relies on multiple teams, services, and environments all working in unison. A topic that always comes up, when setting up a new development environment: How do we secure important credentials, while not making it too complicated for the rest of the team?
The key when working with version control systems like Git, is to keep any type of credentials out of the versioning system. These can be API keys, database or email passwords.
Even if its a private repository, development environments might change. It can be a simple staging & live website setup you are maintaining.
The simplest way in PHP is to use .env files to store your credentials outside of the public accessible directory structure. So outside the public_html, but still within the reach of the executing environment to read it. Variables are accessible through $_ENV['yourVar'] or getenv("yourVar"), once included in your code.
To make it simple you can use the popular package vlucas/phpdotenv, which reads and imports the file automatically.
Don’t fool yourself, if an attacker finds a way into your system, these variables can be easily read. This is just hiding the file from public access and provides some convenience while developing or sharing code.
Some people propose to encrypt / decrypt environment variables using a secret key. But if an attacker can access your data, he can also find the secret key.
There are some nice packages that offer just that. You have to decide if those fit your ammo.
php artisan credentials:edit
The Apache2 environment variables are set in the /etc/apache2/envvars file. These variables are not the same as the environment variables of your Linux system; they are stored and manipulated in an internal Apache structure.
The /etc/apache2/envvars file holds variable definitions such as APACHE_LOG_DIR (the location of Apache log files), APACHE_PID_FILE (the Apache process ID), APACHE_RUN_USERS (the user that run Apache, by defaultwww-data), etc.
You can open and modify this file in a text editor of your choice. This is nice, but far from simple and requires a server restart. This is something which helps you when hardening security on a live deployed setup.
There are dynamic approaches, but you can do some research for that yourself :) Skipped that rabbit hole for now …
Handling secrets completely detached is another possibility. This is surely an overkill for most cases, but using an Infrastructure Secret Management concept might be worth looking into, if you are working on bigger scale projects that involve multiple development teams and setups. These services also often deal with secret rotation.
HashiCorp Vault – „Vault is a tool for securely accessing secrets. A secret is anything that you want to tightly control access to, such as API keys, passwords, certificates, and more. Vault provides a unified interface to any secret, while providing tight access control and recording a detailed audit log.“
You can deploy your own vault on your own infrastructure or test out a hosted version, which is free for Open Source projects. HashiCorp Vault
You will find a bunch of Hashicorp related packages that will help you to integrate a vault into your project workflow (scmrus/php-vault-env , poc-webapp-vault).
While this is nice, you will need to cache / store credentials somewhere, as you don’t want to query the vault on every single access.
The Hashicorp Vault is not the only Infrastructure Secret Management solution. There is a nice Github Gist that lists other solutions and a nice feature matrix.
Amazon also provides a solution called AWS Secrets Manager, which makes a lot of sense, when you build and deploy on AWS already :)
Gatsby is a free and open source framework based on React that helps developers build blazing fast websites and apps.
While researching some popular static site generation tools, GatsbyJS comes up often. I have played with NuxtJS and Hugo in the past, but what I REALLY like about GatsbyJS is the plugin / modular system. You can build your website with plain-old React and CSS styles, but make your development more efficient by adding node_modules.
Also being able to import any data source with ease, using GraphQL, is amazing. And when it comes to content management, you can easily hook a headless WordPress or Drupal setup into the mix and consume their REST APIs :)
I am not switching my own website to GatsbyJS anytime soon, but its another tool in my toolbox for future project consideration !
There are many tutorials on Youtube about getting started, maybe something to consider for the next freetime testdrive ;) Enjoy …
GatsbyJS @ Github
Manet is a REST API server which allows capturing screenshots of websites using various parameters.
The Node.js server can use SlimerJS or PhantomJS as headless browser engines.
I have build similar with CasperJS, but this is far better for those that want a simple straight solution.
A nice set of CSS3 Animations that can be easily used to spice up your design.
Since I started in 2002, all iterations of portalZINE have been pure english content websites. You can read about the why on my services page.
I had potential customers in Germany complain about that a lot over the past few years. But your own website often suffers, while your customers get all the attention. That is how it is and how it should be!
Creating Multi – Language websites has been part of my services & portfolio for years, with an extreme application setup handling 13 languages in 2014 for the soccer world cup.
Multi-Language setups have come a long way and it was time to showcase that on my own setup as well. Not only to calm those potential customers, but to testdrive new functionality and possibilities on my own setup. portalZINE has always been my testlab for stability and new feature sets.
Most of my static pages are available in English and German now, the blog itself will remain pure English.
Need help setting up a multi language website, get in touch!
The GDPR makes us jump through a lot of hoops to cleanup our websites and make all our code compliant. Many aspects of the GDPR are far from completely defined yet and there is a great uncertainty what is required, what can stay and what needs to be adjusted right now.
Something like that :“Our website uses plugins from YouTube, which is operated by Google. The operator of the pages is YouTube LLC, 901 Cherry Ave., San Bruno, CA 94066, USA.
If you visit one of our pages featuring a YouTube plugin, a connection to the YouTube servers is established. Here the YouTube server is informed about which of our pages you have visited.
If you’re logged in to your YouTube account, YouTube allows you to associate your browsing behavior directly with your personal profile. You can prevent this by logging out of your YouTube account.
YouTube is used to help make our website appealing. This constitutes a justified interest pursuant to Art. 6 (1) (f) DSGVO.
Further information about handling user data, can be found in the data protection declaration of YouTube under https://www.google.de/intl/de/policies/privacy.“
The question remains, if that is actually enough? Youtube allows you to switch to a cookieless embed on their website, that limits the data flowing to Google servers.
But how do you use that programmatically, with the Youtube iFrame API?
The iFrame API documentation has not been updated since 2014 and does not mention any option to switch to the cookieless youtube host.
But there is an easy option, just add the host option „https://www.youtube-nocookie.com“ to your calls :
There we go, so simple and painless :)
The GDPR is a good thing, as it helps to secure our privacy. Those that are complaining now, are those that waited until the GDPR went live and did not take the time to really prepare soon enough.
BTW the email spam sent by so many services, was so not required, but helped me to clean up / delete those dormant accounts ;)
QueryBuilder is an UI component to create queries and filters.
Really neatly programmed solution, with many possible ways to hook into it with your own plugins.
Easily target images with the jQuery filter function, using a Regular Expression. With this you can easily find elements that have a matching class, like ‚featured_image‘ or ‚testimonial_image‘.
A tiny requestAnimationFrame powered 60+fps lightweight parallax tilt effect for jQuery.
See the Pen Parallax tilt effect, Tilt.js by Aldo Ferrari (@AldoFerrari) on CodePen.
CodeCombat is a multiplayer programming game for learning how to code. The ultimate goal of CodeCombat is to bring more users into the field of computer programming by making the logic and syntax more accessible and enjoyable to learn. The end game is to educate a whole new generation of computer programmers that started their journey by slaying ogres and defending their castles from oncoming enemy hordes.
CodeCombat itself can be found on GitHub under the free MIT license. All the art assets (sprites, backgrounds, sound effects, etc.) can also be found on GitHub and are published under a Creative Commons CC BY 4.0 license. This allows easy use of the game artwork for projects of students.
You can subscribe online or setup a dev environment on Windows, Mac or Linux yourself. You need to be able to follow instructions and have some basic technical knowledge.
While the setup on the Mac and Linux are straight forward, Windows is the hardest to get working! (CodeCombat Wiki)
Used some AppleScript magic and Automator to ease the startup of the setup when needed. The setup might vary on your end, as I am using iTerm2 as a Terminal replacement.
CodeCombat is a really fun way to get into programming and keep your kids motivated.
CodeCombat Website / GitHub