Category: Magento

Install Magento 2.4.0 on Ubuntu 18.04

Ref: https://www.rosehosting.com/blog/how-to-install-magento-2-4-with-lemp-stack-on-ubuntu-20-04/

Requirements: PHP7.4, Nginx/Apache2, MySQL, ElasticSearch

CHECK PHP VERSION. IF NOT PHP7.4, INSTALL/CHANGE IT TO 7.4

FIND OUT IF THERE IS PHP7.4 INSTALLED OR NOT

IT SEEMS I HAVEN’T INSTALLED PHP7.4 YET (BUT I FOUND IT ON /etc/php/7.4). IT MEANS IT ALREADY INSTALLED BUT IT DIDN’T HAVE THE OTHERS MODULES (PHP-FPM, ETC). SO INSTALL THEM

NOTE: I HAVE TO INSTALL THEM VIA TELKOMSEL FLASH BECAUSE INDIHOME CAN’T INSTALL THEM!
CHECK AGAIN THE AVAILABLE PHP AND MAKE SURE PHP7.4 IS INSTALLED THEN SELECT IT

NOW

THEN CHANGE PHP7.4-FPM SETTING:

CHANGE THE CONTENT:

THEN RESTART PHP7.4-FPM SERVICE:

CHECK NGINX SYNTAX: sudo nginx -t
RESTART NGINX: sudo systemctl restart nginx
OPEN IT: http://localhost/phpinfo.php (NEED TO CLEAR THE BROWSER CACHE FIRST)
IF YOU CAN’T OPEN http://localhost/phpinfo.php PROPERLY, PLS MAKE SURE THE NGINX CONFIGURATION FILE IS CORRECT

MAKE SURE THE ‘DEFAULT’ PORT IS 80 NOT 8080 AND THE PHP-FPM POINT TO PHP7.4

OKAY. DON’T FORGET TO RESTART NGINX SERVICE

THE CURRENT PHP VERSION FOR FPM IS 7.4.12

CHECK STATUS ELASTICSEARCH

IF IT’S NOT ACTIVE OR DISABLED, THE START THE SERVICE

THEN CHECK THE ELASTICSEARCH VERSION BY OPENING THE PORT 9200 ON THE BROWSER: http://localhost:9200/
HERE IS THE FINE RESULT

INSTALL MAGENTO 2.4 VIA COMMAND LINE — AVOID THIS BECAUSE SOMEHOW I GOT THE ‘DEV’ VERSION NOT STABLE VERSION. SO IT’D BE BETTER TO DOWNLOAD THE ARCHIVE HERE https://magento.com/tech-resources/download
CREATE A NEW DIR ‘magento24’ THEN USE GIT CLONE TO GET THE MAGENTO CODE (NOTE: IT TOOK A WHILE)

RUN ‘composer install’

BUT I GOT THIS ERROR

IT SEEMED I FORGOT TO INSTALL php-soap (THERE IS NO php7.4-soap). INSTALL IT

THEN ENABLE IT IN ‘/etc/php/7.4/cli/php.ini’ AND ‘/etc/php/7.4/fpm/php.ini’. FOR EXAMPLE

THEN UNCOMMENT

DON’T FORGET TO RESTART NGINX
CHECK IT

ALSO CHECK IT ON http://localhost/phpinfo.php
IF EVERYTHING ALRIGHT, RERUN ‘composer install’
IF EVERYTHING ALRIGHT, THEN CREATE A NEW DATABASE ‘magento24’ WITH COLLATION ‘utf8mb4_unicode_520_ci’ THEN RUN THIS:

MAKE SURE EVEYTHING IS FINE

Change the ownership of the magento2 directory to www-data with the following command:

THEN CREATE NGINX CONFIG FILE

The content:

Then

Then

Then insert

CHECK THE NGINX AND RESTART

IF NEEDED SET THE FILE PERMISSION and ownership

COMPILE

BUT WHEN I OPENED IT ON THE BROWSER http://magento24.test/
I GOT 404 ERROR.
FROM THE /var/log/nginx/error, I FOUND

I TRIED TO COPY index.php FILE INTO THE magento24 DIR. IT’S WORKING BUT IT FAILED TO LOAD THE STATIC FILES (CSS, JS, ETC) SO I THINK I’LL INSTALL IT VIA FILE DOWNLOADED ON https://magento.com/tech-resources/download
IT SEEMS THE COMMAND LINE INSTALLED THE DEV VERSION

—
INSTALL FROM THE DOWNLOADED FILE (ALSO READ http://myprojects.advchaweb.com/index.php/2019/02/26/install-magento-2-3-on-ubuntu-16-04-and-nginx/)
BUT STUCK ON http://magento24.test/setup/#/landing
CAN’T FIND ANY BUTTON TO CONTINUE!!!

Create a Frontend Form

Read: https://magento.stackexchange.com/questions/222423/how-to-create-a-form-and-save-that-data-in-database-in-magento-2/222427
Create a directory Advcha/MyForm in your magento root project/app/code
Then create a new file registration.php:

Then in etc/module.xml:

Then do this to make sure it’s okay.

Create a frontend router in etc/frontend/routes.xml:

I want the url to show the form is /myform/myform/index
So create a dir and file in Controller/MyForm/Index.php. But I need to create a layout first in view/frontend/layout/myform_myform_index.xml:

Then create a block in Block/MyForm.php:

Then create the template in view/frontend/templates/myform.phtml:

Then here is the controller in Controller/MyForm/Index.php:

DONE! PLS RUN

CHECK THE PAGE IN URL LIKE: http://scm.test/myform/myform/index
PLS TRY TO FILL THE FORM THEN PRESS THE SUBMIT BUTTON!

Magento 2 – Create Module API

CREATE A MODULE TO USE API TO PULL PRODUCTS DATA FROM SINOGOODIES (SG) WEBSITE
I PUT THE CODE IN app/code/advcha/SGApi DIRECTORY
Create registration.php

Create etc/module.xml

ENABLE THE MODULE

Create etc/webapi.xml

Create the API interface Api/SGInterface.php

Create a dependency injection di.xml for the SGInterface to the implementation in Model directory.
etc/di.xml

Create the implementation in Model/SG.php (FOR EXAMPLE)

SETUP UPGRADE AND COMPILE DI

TEST THE API CALL: http://ayoimport-dev.test/rest/V1/sgapi/getproduct
THE CORRECT RESPONSE WILL BE LIKE THIS:

 

Magento 2.3 – Create Custom Widget

Ref: https://www.magestore.com/magento-2-tutorial/how-to-create-magento-2-widget/
https://www.cloudways.com/blog/magento-2-custom-widget/

1. Create ‘Contact Informations’ Widget
Create a module directory ‘Advcha_Customwidget’ in app/Advcha/Customwidget

Then create a registration file registration.php in the above directory:

Then create the module file module.xml in etc/ directory:

Then create the backend widget form widget.xml in etc/ directory:

Then create the block file Contactinformations.php in Block/Widget/ directory:

Create the source file for gender input Gender.php in Model/Config/Source/ directory:

Then create the template file to show the widget contact_informations.phtml in view/frontend/templates/widget/ directory:

Enable the module: php bin/magento module:enable Advcha_Customwidget
then clear the cache: php bin/magento c:f

I want to display the widget in the homepage. So in the admin page: Content -> Pages,
Find Homepage -> Edit
In Content -> Show/Hide Editor -> Insert Widget -> On the Widget Type dropdown, find ‘Contact Informations Widget’ then fill the options like ‘Full Name’, ‘Age’ and ‘Gender’.
The html widget would be like this:

Then Save the page. Also it worth to run the command: php bin/magento c:c && php bin/magento c:f

Then refresh your homepage. It’d show the widget at the bottom (above the footer on the Luma theme).

2. Create ‘Category’ Widget
ref: https://www.dckap.com/blog/create-category-widget-magento-2/
Create a module directory ‘Advcha_Catwidget’ in app/Advcha/Catwidget

Then create a registration file registration.php in the above directory:

Then create the module file module.xml in etc/ directory:

Then create the backend widget form widget.xml in etc/ directory:

Then create the block file ShowCats.php in Block/Widget/ directory:

Then create the template file to show the widget showcategories.phtml in view/frontend/templates/widget/ directory:

Enable the module: php bin/magento module:enable Advcha_Catwidget
then clear the cache: php bin/magento c:f OR RUN THE FULL COMMAND:

I want to display the widget in the homepage. So in the admin page: Content -> Pages,
Find Homepage -> Edit
In Content -> Show/Hide Editor -> Insert Widget -> On the Widget Type dropdown, find ‘Contact Informations Widget’ then fill the options like ‘Master Category Id (type ‘2’ for default top category)’. For the default top category, please type: 2
The html widget would be like this:

Then Save the page. Also it worth to run the command: php bin/magento c:c && php bin/magento c:f

Then refresh your homepage. It’d show the widget at the bottom (above the footer on the Luma theme).

UPDATED!!!
TO SHOW ALSO THE SUB CATEGORIES, USE AJAX TO REFRESH THE SUB CATEGORIES AND REDIRECT TO THE SEARCH CATEGORY IF THE ANY OF THE CATEGORY AND/OR SUB CATEGORY IS SELECTED!

MODIFY Advcha/Catwidget/Block/Widget/ShowCats.php:
NOTE: I USED ‘Psr\Log\LoggerInterface’ FOR LOGGING BUT IT CAN’T WRITE TO THE LOG FILE SO I USED Zend Log ($writer = new \Zend\Log\Writer\Stream(BP . ‘/var/log/collection.log’))
I SAVED THE OLD FUNCTION TO ‘getCategoryCollection_old’ AND REPLACE IT WITH ‘getCategoriesCollection’ FUNCTION:

Then modified Advcha/Catwidget/view/frontend/templates/widget/showcategories.phtml:

 

Install Vue Storefront On Ubuntu 16.04

Ref: https://docs.vuestorefront.io/guide/installation/linux-mac.html#requirements
https://medium.com/the-vue-storefront-journal/vue-storefront-how-to-install-and-integrate-with-magento2-227767dd65b2

Requirements
– Docker (with docker-compose installed).
Already included in vue-storefront and vue-storefront-api Docker images (required locally, if you do not use containerization):
– Node.js Active LTS (>=8.0.0)

– Yarn (>=1.0.0)

– ImageMagick (to fit, resize and crop images)

First, Install Docker CE for ubuntu (https://docs.docker.com/install/linux/docker-ce/ubuntu/#install-using-the-repository)

Install using the repository
Before you install Docker CE for the first time on a new host machine, you need to set up the Docker repository. Afterward, you can install and update Docker from the repository.

SET UP THE REPOSITORY
Update the apt package index:

Install packages to allow apt to use a repository over HTTPS:

Add Docker’s official GPG key:

Verify that you now have the key with the fingerprint9DC8 5822 9FC7 DD38 854A E2D8 8D81 803C 0EBF CD88, by searching for the last 8 characters of the fingerprint.

Use the following command to set up the stable repository.

INSTALL DOCKER CE
Update the apt package index.

Install the latest version of Docker CE and containerd, or go to the next step to install a specific version:

Verify that Docker CE is installed correctly by running the hello-world image.

This command downloads a test image and runs it in a container. When the container runs, it prints an informational message and exits.
Check docker version: (https://docs.docker.com/engine/reference/commandline/cli/)

Docker CE is installed and running. The docker group is created but no users are added to it. You need to use sudo to run Docker commands. Continue to Linux postinstall to allow non-privileged users to run Docker commands and for other optional configuration steps.

It’s important to manage docker for non-root user (https://docs.docker.com/install/linux/linux-postinstall/)
Create the docker group.

Add your user to the docker group.

Logout and re-login  so that your group membership is re-evaluated.
Verify that you can run docker commands without sudo.

 

Install Docker Compose
https://docs.docker.com/compose/install/
On Linux, you can download the Docker Compose binary from the Compose repository release page on GitHub. Follow the instructions from the link, which involve running the curl command in your terminal to download the binaries. These step by step instructions are also included below. To ensure you have the latest version, check the Compose repository release page on GitHub.

Apply executable permissions to the binary:

Test the installation.

For installing ImageMagic for Ubuntu 16.04, PHP7.2-FPM and NGINX. pls see http://www.mariorodriguez.co/2018/01/17/install-enable-imagick-on-ubuntu-16.04.html and https://askubuntu.com/questions/769396/how-to-install-imagemagick-for-php7-on-ubuntu

In /etc/php/7.0/fpm/php.ini file, insert ‘extension=imagick.so’ line. then save.
Restart php7.2-fpm and nginx

Check the extension in phpinfo (http://localhost:8080/phpinfo.php)

Installation Vue StoreFront

To get started — first of all we need to install all projects on your local machine. Fortunately it’s very simple step because we do have CLI installer which installs vue-storefront and vue-storefront-api altogether.

First step is to get the VS from our github:

git clone https://github.com/DivanteLtd/vue-storefront.git vue-storefront

Go to the ‘vue-storefront’ directory

MAKE SURE YOU CHECK PORT 8080 (USUALLY IT BEING USED BY NGINX) BY ‘sudo netstat -plntu’. IF THE PORT IS BEING USED BY NGINX, PLS STOP IT FIRST ‘sudo service nginx stop’. PORT 8080 WOULD BE USED BY MAGENTO 2 BACKEND???
MAKE SURE YOU ALREADY ADD USER FOR DOCKER
<ERROR_YARN_INSTALLER_DOCKER_NON_ROOT>

SOLUTION: ADD USER FOR DOCKER. SEE THE ABOVE REVISED DOCKER INSTALL!
</ERROR_YARN_INSTALLER_DOCKER_NON_ROOT>
RUN ‘yarn build’ BEFORE ‘yarn installer’. DONT FORGET REMOVE ‘vue-storefront-api’ DIRECTORY

<ERROR_YARN_INSTALLER_STOREFRONT_NPM>

SOLUTION: https://docs.vuestorefront.io/guide/basics/recipes.html#how-to-prevent-an-error-can%E2%80%99t-build-storefront-npm
RUN: ‘yarn build’ BEFORE ‘yarn installer’.
</ERROR_YARN_INSTALLER_STOREFRONT_NPM>
WORKING!

IF THE NODE JS SERVER IS STOPPED, START/RESTART IT AGAIN BY RUNNING: ‘yarn dev’ in ‘vue-storefront’ directory and ‘vue-storefront-api’ directory. Make sure nginx that use port 8080 is stopped (check port : sudo netstat -plntu)

Then to open the frontend (vue-storefront): http://localhost:3000/ –> OK. BUT WHEN I CLICK ANY LINK ON THE PRODUCT, I GOT ‘The product, category or CMS page is not available in Offline mode. Redirecting to Home.’
to open the backend (vue-storefront-api): http://localhost:8080/ –> NOT OK! I got this printed: Cannot GET /
http://localhost:8080/api –> printed: {“version”:”0.1.0″}

Install Magento 2.3 PWA Studio On Ubuntu 16.04

Ref: https://magento-research.github.io/pwa-studio/venia-pwa-concept/setup/

Magento2.3 PWA Studio Setup

Are you prepared to try all benefits of Magento PWA Studio?


https://hackernoon.com/getting-started-with-magento-pwa-studio-with-poc-c54c33f8d038

Check Requirements:
It say my working environment need:
NodeJS >=10.14.1 LTS
Yarn >=1.13.0
Another source say: ‘You must have a version of node.js >= 8.0.0, and a version of npm >= 5.0.0. The latest LTS versions of both are recommended.’
Check my current:

I use NVM (http://myprojects.advchaweb.com/index.php/2018/01/24/ubuntu-16-04-3-installation-problem-and-solution/) to install node js. It seems my current didn’t fit the requirements. I need to install node js version 10.x.x and update yarn and npm.
CHECK INSTALLED NODE VERSION:

or use ‘nvm ls-remote’ to see all the node js list and version.
Use nvm to install node js v10..15.1. it’s a latest LTS version for v10.x.

It also make it the new version as an active node js version!

or use ‘nvm use 10.15.1’

but npm version now is v6.4.1. Yarn already installed for the previous node js version but not yet for the current v10.15.1 version. I need to install it again. NOTE: Yarn is more recommended than npm!
Install Yarn (https://yarnpkg.com/en/docs/install#debian-stable)
NOTE: I need to uninstall ‘cmdtest’ first (https://github.com/yarnpkg/yarn/issues/2821).

Check yarn version

INSTALL Magento 2.3 Backend
or INSTALL PWA Studio First??? –> I prefer to install the backend first!
NOTE: I need to use composer to install the backend.
check the composer version

When I use this composer version to download and install magento

it can’t download from repo. it’s did nothing after I supplied the repo.magento.com account for a long time! I NEED TO UPDATE COMPOSER!
But when I want to update the composer, I got an error ‘SHA384 is not supported by your openssl extension, could not verify the phar file integrity’

Based on this link https://github.com/composer/composer/issues/7669, to fix this problem I need to manually download and install composer. Follow this https://getcomposer.org/download/ to download and install composer. It’s almost same. But to install composer system wide, use ‘sudo php composer-setup.php –install-dir=/usr/local/bin –filename=composer’ instead of ‘php composer-setup.php’

To avoid warning like this:

so do like this:

NOTE: Also it recommended to install prestissimo (composer plugin) from https://github.com/hirak/prestissimo

I tried to install magento 2.3 via composer but failed for some reasons. Like the packages can’t be downloaded or it took a long time so I had to cancel it. Probably my slow internet speed and/or the magento repo problems affected the installation as well. I tried to download and install on the afternoon without no progress. The last time I successfully installed it when I tried it on the evening! So here is the working command:

Anyway it took almost 3 hours to complete the command!
Note: I stripped ‘magento/project-community-edition:2.3.0’ from the above command to make sure I got the latest version! It’s not mean it’d not work if I put the version back!
SO ‘/home/teddy/Documents/works/mce230-pwa’ is a Magento installation directory.

The next step is to install Magento by Command Line
First, go to the magento 2.3.0 root directory

Then run this command like this: Use https url like ‘https://mce230-pwa.test/’ for PWA because PWA only works with SSL???

SORRY, ONLY ADMIN CAN SHOW THIS!
Make sure you already create a new database ‘mce230_pwa’. Also match the database credential!
SORRY, ONLY ADMIN CAN SHOW THIS!
SO I completed the installation of magento 2.3 backend. Can I open it on the browser http://localhost/mce230-pwa ??? Should I set it on the web server like nginx or apache? Or it only can be run via node js server??? –> I’m gonna setup nginx for running it. But I need to create self-signed certificate first for enabling ssl (http://myprojects.advchaweb.com/index.php/2019/02/09/create-self-signed-certificate-with-nginx-on-ubuntu-16-04/)
Create a new file

Here is the file content:

Create the Certificate using OpenSSL

It’ll create two new files. There are mce230-pwa.test.crt and mce230-pwa.test.key. Then Copy those files to the Certificates folder on Ubuntu

OK. Now setup the nginx config. Create the config file

Here is the content:

NOTE: I set $MAGE_ROOT TO ‘pub’ DIR LIKE ‘set $MAGE_ROOT /home/teddy/Documents/works/mce230-pwa/pub’ INSTEAD OF JUST ‘set $MAGE_ROOT /home/teddy/Documents/works/mce230-pwa’. SO PWA THEME CAN DISPLAY THE CATEGORY & PRODUCTS IMAGE!
Enable file config

Register the host on my system

Like this:

CHECK THE NGINX SETTING AND RESTART IT:

Set file permission and owner:

Because the installation is already done by composer, then compile!

Give it a try! the frontend: https://mce230-pwa.test/ –> No product displayed because I didn’t install the sample data!
and the backend: https://mce230-pwa.test/admin_magento
user: admin
password: admin123

Now is the steps for installing PWA Studio.
clone it from the repository on current magento 2.3.0 root directory

You will see the pwa-studio directory in /mce230-pwa
Enter into this directoy:

Then run ‘yarn install’. It recommended to use it than ‘npm install’

Then Specify the Magento backend server in .env file. you can see the .env.dist file in
/mce230-wa/pwa-studio/packages/venia-concept/ directory. If you are not
able see, enable show hidden files. Now create .env file from this env.dist

Open this .env file and find MAGENTO_BACKEND_URL. Here configure your local Magento 2.3 instance, my case it is:

Now install sample data for venia-theme to make it good looking. Find the deployVeniaSampleData.sh file in
/mce230-pwa/pwa-studio/packages/venia-concept/ directory. and copy this file in your Magento root directory. Now it must look like
/mce230-pwa/deployVeniaSampleData.sh Now run:

This was tricky because I need several times to make it works. I also need to create a new file ‘auth.json’ and put it in the mce230-pwa directory because I got this error : ‘Could not authenticate against github.com’. ref is here https://www.bountysource.com/issues/64327845-add-shell-script-to-install-venia-sample-data-modules-via-composer. This error can be fixed with providing the github personal api token (https://github.blog/2013-05-16-personal-api-tokens/). So to get the token, go to your github account (https://github.com/settings/tokens) then generate ‘personal access token’. For the scopes, I think I need to select one or all of the options. At first, I didn’t select any scope and the bash script didn’t work. Then I selected all of them and the bash script worked again!. After you got the token, put it in auth.json file. Here is auth.json file content:

Replace “xxxxx” with your github personal access token!
SORRY, ONLY ADMIN CAN SHOW THIS!

<ERROR_I_GOT_PREVIOUSLY>
The problem when I forgot to provide the magento 2.3 root directory

The problem when I should create auth.json (https://www.bountysource.com/issues/64327845-add-shell-script-to-install-venia-sample-data-modules-via-composer)

</ERROR_I_GOT_PREVIOUSLY>

OK. After successful installation compile again:

Then I opened the frontend https://mce230-pwa.test –> No product on the homepage
Then I found some venia products on the links like on https://mce230-pwa.test/venia-accessories.html
But the products image CAN’T BE DISPLAYED!
The images refer to the cache directory in /mce230-pwa/pub/media/catalog/product/cache
I can fix this problem by regenerating the images (https://magento.stackexchange.com/questions/175224/regenerate-catalog-cache-images-issues). So I run

WARNING: It’d take a long time to complete it depend on how many the images and the computer resource. To regenerate the images in the sample venia theme on my pc, it took almost 30 minutes for 1287 products!

But I can’t find ‘venia’ theme on the admin page! I tried to create the symlink like

or just copied ‘/pwa-studio/packages/venia-concept’ into ‘app/design/frontend/Magento’ then rename ‘venia-concept’ to ‘venia’. But none of them display the venia theme in the admin themes content! –> NEED TO LEARN THIS LATER!

Then go back to pwa-studio directory /mce230-pwa/pwa-studio and
start Server. I run ‘yarn run build’ instead of ‘npm run build’. But before running this command, make sure the magento mode is developer.

Then run ‘yarn run build’

Need to recompile again if needed (NO NEED!)

Run server, Use any of the following commands from the project root directory to start: yarn run watch:venia

OR run ‘yarn run watch:all’

Then open it on your browser: https://magento-venia-concept-2hrkd.local.pwadev:8328/
OK. But it can’t show the products image!!!
Temporary solution for this problem is COPY THE CATEGORY AND PRODUCT IMAGES IN CATALOG DIR FROM pub/media/catalog TO the magento root directory –> NOT GOOD IF THERE IS NEW PRODUCT AND IMAGE! SO HERE IS THE BETTER WAY! SET MAGENTO ROOT DIRECTORY TO ‘pub’ DIR. MODIFY nginx CONFIG FILE

THEN MODIFY $MAGE_ROOT FROM

TO

I THINK IT NEED TO RECOMPILE!

<ERROR_IF_PWA_NOT_SSL>

It need SSL!
</ERROR_IF_PWA_NOT_SSL>

Install Redis and Combine With Varnish and Nginx for M2 On Ubuntu 16.04

Ref: https://www.digitalocean.com/community/tutorials/how-to-install-and-configure-redis-on-ubuntu-16-04
https://www.digitalocean.com/community/tutorials/how-to-install-and-secure-redis-on-ubuntu-18-04

Install Redis Server

Then modify /etc/redis/redis.conf file. In the file, find the supervised directive. Currently, this is set to no. Since we are running an operating system that uses the systemd init system, we can change this to systemd:

Next, find the dir directory. This option specifies the directory that Redis will use to dump persistent data. We need to pick a location that Redis will have write permission and that isn’t viewable by normal users.

We will use the /var/lib/redis directory for this, which we will create in a moment:

Save and close the file when you are finished.

Create a Redis systemd Unit File
Next, we can create a systemd unit file so that the init system can manage the Redis process.

Create and open the /etc/systemd/system/redis.service file to get started:

Inside, we can begin the [Unit] section by adding a description and defining a requirement that networking be available before starting this service. In the [Service] section, we need to specify the service’s behavior. For security purposes, we should not run our service as root. We should use a dedicated user and group, which we will call redis for simplicity. We will create these momentarily.

To start the service, we just need to call the redis-server binary, pointed at our configuration. To stop it, we can use the Redis shutdown command, which can be executed with the redis-cli binary. Also, since we want Redis to recover from failures when possible, we will set the Restart directive to “always”. Finally, in the [Install] section, we can define the systemd target that the service should attach to if enabled (configured to start at boot):
<DONT USE THIS SETTING>

</DONT USE THIS SETTING>

<USE THIS SETTING>

</USE THIS SETTING>
Save and close the file when you are finished. After saving and closing the file, I reloaded the systemd manager configuration:

Create the Redis User, Group and Directories
Now, we just have to create the user, group, and directory that we referenced in the previous two files.

Begin by creating the redis user and group. This can be done in a single command by typing:

Now, we can create the /var/lib/redis directory by typing:

We should give the redis user and group ownership over this directory:

Adjust the permissions so that regular users cannot access this location:

Start and Test Redis
Now, we are ready to start the Redis server.

Start the Redis Service

Check that the service had no errors by running:

I got the below error previously because the wrong setting in the redis.service file.

Check it on the terminal

Or make sure port 6379 only be using by redis

Test the Redis Instance Functionality
To test that your service is functioning correctly, connect to the Redis server with the command-line client:

Check that you can set keys by typing:

Enable Redis to Start at Boot
If all of your tests worked, and you would like to start Redis automatically when your server boots, you can enable the systemd service.

To do so, type:

Go to your magento root directory and open app/etc/env.php and add the below codes just before the last line.

Restart the Redis server

Check whether Redis server is working or not. Open your website and view some pages then  run the command

If you see this  keyspace. Then your Redis is configured properly. If you do not see anything below Keyspace then Redis have not cached anything. In this case check your configuration

To flush the Redis cache run the following command

Now your site is optimized with Varnish and Redis.

Benchmark
When I open https://fontaineind.test/ for the first time (varnish after fresh restart still caching so the page load still slower and redis also after first restart and flushdb command executed). I got this from redis-cli info:

Then I refresh the same page (varnish cache is kicking off and redis as well). I noticed the page load faster than only from varnish. But not much. Probably from 10-12 seconds to 8-9 seconds. Here is the output from redis-cli info:

I need to analyze these later.

Configure Varnish, SSL, Nginx and Magento 2 On Ubuntu 16.04

Ref: https://blog.hauri.me/magento-2-with-varnish-and-nginx-as-ssl-termination.html
https://www.absolute-design.co.uk/services/magento-ecommerce/using-nginx-for-ssl-termination-with-varnish-and-magento-2/
https://linuxize.com/post/configure-magento-2-to-use-varnish-on-centos-7/
https://www.digitalocean.com/community/tutorials/how-to-configure-nginx-with-ssl-as-a-reverse-proxy-for-jenkins

On a few last articles, I wrote about the Varnish and Nginx configuration also Self-signed certificate. Now I want to combine them all on my local magento 2 website https://fontaineind.test/. When I run the site, the varnish is not working. I need to configure it (and Nginx) to make it working again.

From many articles I found Varnish can’t work with SSL. Varnish does not support SSL, so we need to use another service as an SSL Termination Proxy, in our case that will be Nginx.

When a visitor opens your website over HTTPS on port 443 the request will be handled by Nginx which works as a proxy and passes the request to Varnish (on port 6081). Varnish checks if the request is cached or not. If it is cached, Varnish will return the cached data to Nginx without a request to the Magento application. If the request is not cached Varnish will pass the request to Nginx on port 8080 which will pull data from Magento and Varnish will cache the response.
If a visitor opens your website without SSL on port 80 then he will be redirected to the HTTPS on port 443 URL by Varnish. So here is the topology
I need to change the Varnish port back to 6081 because I need to redirect HTTP port 80 to HTTPS port 443. (This article said I can still use port 80 for varnish: https://medium.com/magebit/magento-2-full-ssl-with-varnish-d2cfed3d7df also https://www.getpagespeed.com/web-apps/magento/magento-2-nginx-config-ssl-termination-varnish) But I keep the nginx port to 8080. So modify /etc/default/varnish file like this:

Then also modify /etc/systemd/system/varnish.service file to change the varnish port back to 6081

Then modify /etc/varnish/default.vcl

I use host “fontaineind.test” here because I have many local websites. Usually it’s enough to use “localhost”. Port 8080 is the nginx port as the backend server. After saving the changes, I need to restart varnish server:

Don’t forget to verify the varnish port is 6081 now. Just see it by typing

Then I need to modify also the nginx setting for fontaineind.test.

Modify it like this:

So if the user use non-https (port 80) url like http://fontaineind.test/, It’d be redirected permanently (301) to https url like https://fontaineind.test/. Please see

Then if the user entering the https site (port 443), it’d use varnish proxy (port 6081)

If the page request is already exist in the varnish cache, it’d be returned immediately. But if not, it’d look it in the backend server (nginx port 8080).

This is very tricky. Because I use many local website, I have to use ‘listen fontaineind.test:8080;’ instead of just ‘listen 8080;’. It must same with the backend host in /etc/varnish/default.vcl.
NOTE: Somehow the other local websites would be redirected to fontaineind.test. So if I open for example phpmyadmin.test:8080. It’d be redirected to fontaineind.test. This is not expected. So If I want to open phpmyadmin, I need to stop varnish then change ‘listen fontaineind.test:8080;’ to ‘listen 8080;’. I still dont know how to solve this problem.

Don’t forget to modify env.php file in magento root (app/etc/env.php) like this:

So now varnish is working with SSL. Here is the response header on https://fontaineind.test/ (after first refresh)

You can see ‘Age’ and ‘x-varnish’ values.

Install and Configure Varnish for Nginx and Magento 2 on Ubuntu 16.04

Ref:https://blog.pusher.com/speeding-up-your-website-using-varnish/
https://www.cyberciti.biz/faq/how-to-install-and-configure-varnish-cache-on-ubuntu-linux-16-04-lts/
https://www.howtoforge.com/tutorial/ubuntu-nginx-varnish/
https://amasty.com/blog/use-varnish-with-magento-2-for-better-end-user-experience/

Install Varnish:

Start/stop/restart the varnish service:

Check the varnish status (when active):

Varnish installed and it is a default configured to listen on port 6081 and 6082 for varnish admin:

When we open on the browser: http://localhost:6081/, we’d get a varnish error pageHowever http://localhost:6082/ will show page error.
We will be changing this so it listens on port 80 (fontaineind use the default port 6081 for varnish)  and Nginx listens on port 8080. To do this, edit your site’s Nginx configuration file. In our case, this file is /etc/nginx/sites-available/fontaineind.test.

modify

Save the file. Then restart nginx server:

When you open your website with the port 8080, http://fontaineind.test:8080, It’d show the website but the css seems missing! I think I need to clear the cache and rebuild the cache. but it show an expected error.

Another error when trying to show the magento 2 command:

Solution: THIS IS BECAUSE I USE PHP 7.2. CHANGE IT TO PHP 7.0

Then the magento 2 command is running well back.

also probably I need to change the base url to include the port 8080? –> NO NEED. we will take it later. Let’s continue.

Now that port 80 is free (NO. I NEED TO CHECK IT VIA sudo netstat -plntu | grep ‘:80’), let’s configure Varnish to be the one that responds. Open the file /etc/default/varnish for editing. Here is the default content.

Look for the line below:

change ‘-a :6081’ to ‘-a :80’:

Save the file.
NOTE: I also can change the malloc. malloc is RAM usage for Varnish. Default is 256m. I can change it to (for example) 1024m (1G)

Next, open the file /etc/varnish/default.vcl and check that the default backend is set to port 8080, because this is where Nginx serves from now. Look for the line below and make sure the .port is 8080. Here is the default content:

NOTE: For the explanation of vcl_recv, vcl_backend_response and vcl_deliver, pls read https://amasty.com/blog/use-varnish-with-magento-2-for-better-end-user-experience/
make sure the backend port is 8080

Once you have confirmed this, the next thing will be to copy the varnish.service file to our systemd directory. This will enable systemd to start varnish on port 80. Run the command below:

This will copy the varnish service file, and then open an editor with the contents.

Look for the ExecStart line:

Now change the -F -a :6081 to -F -a :80. Leave the localhost:6082 on the same line as it is. Now save and exit the file. Run the commands below to reload everything you have just configured:

The commands above will reload the system daemon, reload varnish, restart the varnish service, and restart Nginx.
NOTE: I need to check the varnish status as well. Varnish can’t start because port 80 already is use:

Check who is using port 80:

it seems nginx with pid 19110 is using both port 80 and 8080. or here is the complete list:

Solution: nginx use both ports 80 and 8080 because in sites-enabled directory there are many nginx setting for different websites that it still use port 80.

SO. REPLACE THE PORT 80 TO 8080 FOR ALL WEBSITE IN SITES-ENABLES DIRECTORY!!!
AFTER I CHANGED THE PORT IN ALL THE WEBSITE, NO MORE APPLICATION USE PORT 80 ANYMORE

OR

Nginx is using port 8080 now. I can start varnish and check the status:

NOTE: TO RUN THE OTHERS RUNNING WEBSITE (WITHOUT VARNISH RUINNING) THAT IT HAD BEEN WORKING PREVIOUSLY, I NEED TO ADD THE PORT 8080 AT THE END OF THE URL. FOR EXAMPLE:
http://localhost:8080/phpinfo.php
http://notarisfemira.test:8080/
http://phpmyadmin.test:8080

Now visit the IP of your web page and you should see nothing has changed. However, when you run it through the HTTP checker we used before, you should see that the headers have changed.
http://fontaineind.test/ –> First time run about 20 seconds

The second run (refresh) about 9 seconds

NOTE: I can see some variables like X-Varnish and Age. But why Age still 0 on the refresh page? It means it miss the cache.
In magento, I already enabled Page Cache and Block HTML cache.

Configure Magento to use Varnish
To configure Magento to use Varnish:

Log in to the Magento Admin as an administrator.
Click STORES > Configuration > ADVANCED > System > Full Page Cache.
From the Caching Application list, click Varnish Cache (recommended).
Enter a value in the TTL for public content field.
Expand Varnish Configuration and enter the following information:
Access list: localhost   –> 172.31.31.224 for fontaineind.com.au
Backend host: localhost   –> 172.31.31.224 for fontaineind.com.au
Backend port: 8080
Then click a button ‘Export VCL for Varnish 4’ -> It’d create a file ‘varnish.vcl’ and download it.
Here is the file content:

SO I need to modify the content of /etc/varnish/default.vcl according to this varnish.vcl.

Just copy and paste all content of varnish.vcl to all content in /etc/varnish/default.vcl. Then restart varnish: sudo service varnish restart
NOTE: IN THE DEV SERVER, I PREFER TO DISPLAY THE X-VARNISH AND AGE VARIABLES. SO I MODIFIED /etc/varnish/default.vcl LIKE THIS:

I also modified /home/teddy/Documents/works/fontaineind/app/etc/env.php to include the varnish setting:

clear and flush the cache. BUT Age still 0 !!!! EVEN WEIRDS, WHEN I CHANGED IN THE MAGENTO ADMIN THAT CACHE APPLICATION IS VARNISH THEN REFRESH THE WEBSITE (ALSO RESTART VARNISH), I GOT THE PAGE LOAD SLOWER!!! WHY?? –> SOLUTION: I NEED TO EXPORT VCL FILE LIKE ABOVE AND COPY THE CONTENT INTO /etc/varnish/default.vcl

NOW THE VARNISH IS WORKING!!!
THE SECOND AND MORE REFRESH WOULD MAKE THE PAGE LOAD FASTER. HERE IS THE RESPONSE:

SEE THE AGE = 42 AND X-Varnish: 131131 3

Magento 1.9.3.2

  1. Download the installer from https://magento.com/tech-resources/download. At the time writing, the latest magento 1.x version is 1.9.3.2. I downloaded the zip version (magento-downloader-1.9.1.0-2015-02-09-10-17-59.zip). I tried to download the .gz and tar.bz2 but it didn’t work. Then download the sample data from the same page.
  2. Create a new database first (may be with phpmyadmin). I gave the database name ‘magento19’.
  3. Extract the sample data from phpmyadmin, then import the sql file (magento_sample_data_for_1.9.2.4.sql) in the extracted data.
  4. Extract the installer file magento-downloader-1.9.1.0-2015-02-09-10-17-59.zip. It only contain single file: downloader.php. Then put this file into your magento root in your webserver. I put it in ‘magento19’ directory
  5. Create a virtualhost for this site:

    Here is the content:

     
  6. Enable the site:
  7. Put it in /etc/hosts/

    add this line:

     
  8. Restart apache webserver:
  9. Begin installation of magento 1.9.3.2 by opening : http://magento19.dev/developer.php. Then follow the instruction. It’d download the magento files needed.
    SORRY, ONLY ADMIN CAN SHOW THIS!
    Note: The PHP version must be between 5.2 and 6.0. I can’t use php 7.0 so I use php 5.6.
  10. Copy and paste the directories ‘media’ and ‘skin’ in the extracted sample data into the magento19 web directory. Just override the current media and skin directories.
  11. Now you can run the site: http://magento19.dev/
    and the admin site: http://magento19.dev/admin

NOTE: At first I made a mistake with installing magento 1.9 without the sample data. To install the sample data, I need to drop the database then create it again. Then follow #3 step. After that, I need to run the installer again http://magento19.dev/developer.php but this time without downloading the magento files because the files already downloaded. Follow the instruction again then if nothing wrong, it’d run well.

UPDATED
20191010
Download and Install extension GLS Shipping from https://marketplace.magento.com/gls-official-gls-dispatch.html
I tried to install it via connect manager then find and upload the package zip file (gls-Official_GLS_Dispatch-1.2.4.tgz). But I got this error message:

OR (CASE FOR Indianic_Couponimpexport EXTENSION)

BECAUSE THE PHP VERSION IN package.xml (EXTRACT FROM THE ZIP FILE) FILE LIKE THIS:

CHANGE IT TO

THEN RE-ZIP (Indianic_Couponimpexport-1.0.0.1-php7.tar.gz) AND RE TRY TO UPLOAD IT AGAIN
BUT GOT ANOTHER ERROR

NOTE: TO RE-ZIP THE PACKAGE, IT NEED TO INCLUDE ONLY THE EXTENSION FILES. DON’T INCLUDE THE PACKAGE DIR NAME!!! SO IT’D BE BETTER TO ZIP IN THE DIR NOT OUT THE DIR

I TRIED TO BACK TO ADMIN PAGE BUT I GOT MAINTENANCE PAGE. I CAN RESOLVE IT WITH n98magerun TO DISABLE MAINTENANCE MODE:

I NEED TO ENABLE LOG (System -> Configuration -> Developer -> Log)
THEN CLEAR/CLEAN THE CACHE

THE LOG WILL BE IN /home/teddy/Documents/works/magento19/var/log.
DONT FORGET TO SET THE FILE PERMISSION

I TRIED TO REUPLOAD THE PACKAGE BUT GOT THIS PERMISSION ERROR:

ALSO CHECK THE LOG IN /home/teddy/Documents/works/magento19/var/log/system.log

SOLUTION: SET THE FILE PERMISSION IN app/code/local/

RE RUN THE PACKAGE INSTALL AND SUCCESS!

FOR GLS SHIPPING, AFTER SET THE PHP VERSION AND NAME, I GOT THIS ERROR MESSAGE WHEN I TRIED TO INSTALL

THIS IS BECAUSE IN package.xml, THERE IS CHANNEL

SOLUTION: ADD THE CHANNEL (READ: https://stackoverflow.com/questions/29071430/connect-error-the-community-channel-is-not-installed-in-magento-site)

THEN RE INSTALL BUT GOT ANOTHER ERROR:

BUT IT INSTALLED SUCCESSFULLY. I NEED TO RUN n98 TO CLEAN THE CACHE.
TRIED TO UNINSTALL

ALSO DELETE THE FILES MANUALLY!
BUT I CONCERN ABOUT GLS MENU IN THE ADMIN PAGE SHOW 404 ERROR (http://magento19.test/index.php/admin/system_config/edit/section/gls/key/107260543ac135ee4fd87400f3e821c8/)