Because we love what we do!

There is always a good chance you meet people in your life that really affect you and make you be creative. There is no magical formula to achieve this. It just happens through hard work and open mind.

Apparently there should be a starting point and for us this has been our long and strong connetion.

All of us have been working in various fields of the industry, all have to do with the media, and soon we realized we could offer some good quality service if we team up.

This is how we gradually developed our communication and workflow. Step by step we have managed to complete complex projects concerning a wide variety of services and skills. All based on skills and cooperative spirit!

In this area of the web site we will post ideas and media we love and find interesting from all around the web.

Have Fun and enjoy Solomon Designs!

How to install Joomla 3 on a Linux VPS Server

Hosting a web site on a shared hosting environment is convinient, but doesn’t give you the flexibility we sometimes need. This is a case when we need to access the server directly like changing file permissions or run a Python script on the server. In a shared host environment the user only has access to the File Manager through a cPanel (if available) and that’s all. Moreover the VPS servers are relative cheaper. A quick Duck Duck Go 🙂 search will provide you with a lot of results starting from even $5/month.

Also a VPS server is, at least in theory, faster than a Shared Hosting Environment. Generally speaking if you need total freedom you will find it difficult to stay in a Shared Host. Now that i convinced you let’s go to our tutorial!

I will try to keep the process as fast as possible and try to avoid the picture approach or video. I suppose the user knows how to use the Terminal and troubleshoot any errors. The process is rather long and all i wanted is a quick guide to do this with all the small details that might appear (like permission assignment) that sometimes are forgotten or haven’t been tested on the process. So for that reason i have cloned the whole process, but there is strong possibility you find small differences. I will be happy to read your comments and add/correct commands that would work more globally for a bigger variety of systems.

So the scenario is that we have just bought some VPS hosting from some online company and we want to install Joomla! on an absolutely empty linux server.

  1. In the first place we need to buy a VPS from some provider. Like i mentioned this can be really cheap and you can have some options here:

  2. Next we need to open a terminal (Ctrl+Alt+T) and type ssh [email protected]_ADRESS_OF_YOUR_VPS

  3. Install unzip: apt-get install sudo unzip

  4. We need to create the user (let’s name it solomon): useradd -m -s /bin/bash solomon

    -m option will create a folder named solomon inside the home directory of your account

    -s option will define the default shell to be bash

  5. We need to change the user password (let’s call it solomon): passwd solomon

  6. We need to place the user we just created into the SUDO: We type visudo and then in the edit screen under #allow members we add ALL=(ALL:ALL) ALL and SAVE

  7. Prevent the root user from login with SSH: vi /etc/ssh/sshd_config

    We need to find the command PermitRootLogin no and set it to no.

  8. Save & Exit

  9. We login again as the new user: ssh [email protected]_ADRESS_OF_YOUR_VPS

  10. Enter password

  11. Now we need to install some usefull programmes: sudo apt-get install apache2 mysql php5

  12. We will get a window asking for the mySQL Password (Note this down because it is very important)

  13. Install some more scripts: sudo apt-get install php5-gd php5-mysql

  14. Now we are ready to install Joomla!

  15. We create the necessary directories: mkdir bin, cd bin , mkdir joomla, cd joomla

  16. Get joomla from the website: (You need to go to https://downloads.joomla.org/ and copy link adress with your mouse in order to have the latest version of joomla- for me it is 3-6-5)wget https://downloads.joomla.org/cms/joomla3/3-6-5/joomla_3-6-5-stable-full_package-zip?format=zip

  17. cd /var/www/html

  18. sudo mkdir joomla

  19. cd joomla

  20. We unzip the filesudo unzip /home/solomon/bin/joomla/joomla_3-6-5-stable-full_package-zip

  21. cd ..

  22. Now we have to change the ownership of the folder so www-data owns it: chown www-data:www-data ./joomla/

  23. We create the database user, the database and assign the user to the database: mysql -u -root -p

  24. -u option:means user

  25. -p option:means password

  26. Now we have entered the mySQL terminal – We need to create a user and assign a password: CREATE USER 'joomla_user'@'localhost' IDENTIFIED BY 'we_define_a_password_here';

  27. We create the database:CREATE DATABASE joomla_db;

  28. GRANT ALL PRIVILEGES ON joomla_db.* TO 'joomla_user'@'localhost';

  29. exit

This is the end of the Tutorial. I am positive it contains all the necessary steps to perform the task. Implications might appear for different system Hardware Setups and different Linux Distributions, but it is unlikely. The commands are Standard Linux Network Administration Commands.

The benefit of having this task performed fast and the flexibility to have an easy to read and execute Walkthrough has been my motivation

Hope you enjoy it and i am very welcome to comments and suggestions.

Resources:
The top image was downloaded from:https://alpha.wallhaven.cc
Usefull info: https://docs.joomla.org/Creating_A_VPS_Testing_Server

How to install Zurb’s Foundation 6 with SASS compiler using the CLI on an Ubuntu PC p.2

In the second part of the Tutorial Install Foundation 6 on Ubuntu using cli i will cover the use of Gulp as an automation handler.

Gulp can help you perform tasks that otherwise would need extra work after you have finished coding and would need to do them every time from scratch. So it can significantly improve your Workflow and reduce time spend on various tasks.

I will focus on the Foundation 6 Framework, i don’t intend to describe Gulp in general, this is not the the scope of the Tutorial. What is usefull is to learn the basic structure of a Gulp file and show how somebody can add more features using the Gulp plugins.

We should know that since we isntalled Foundation 6 using the CLI in the Previous Tutorial this means we already have installed Gulp and there is also a Gulp file in our Project’s root folder.

The file you get by default is written further with my explanation on each line after the //:

var gulp = require('gulp');//we require the gulp to be present

var $ = require('gulp-load-plugins')(); //Automatically load any gulp plugins in your package.json

var sassPaths = [ //declare variables regarding our files paths we want to update every time Gulp executes

'bower_components/normalize.scss/sass',

'bower_components/foundation-sites/scss',

'bower_components/motion-ui/src'

];

gulp.task('sass', function() { // we declare our first gulp task

return gulp.src('scss/app.scss')

.pipe($.sass({

includePaths: sassPaths,

outputStyle: 'compressed' // if css compressed **file size**

})

.on('error', $.sass.logError))// error handling

.pipe($.autoprefixer({

browsers: ['last 2 versions', 'ie >= 9']

}))

.pipe(gulp.dest('css'));

});

gulp.task('default', ['sass'], function() { // Creates a watcher that will spy on files and compile css

gulp.watch(['scss/**/*.scss'], ['sass']);

});

In case you need to add some more task somebody just needs to add this code at the end of the file:

gulp.task('default', function() {

// place code for your default task here

});

So if for example we need to minify our images then

  1. We install the Gulp Plugin: gulp-imagemin $ npm install --save-dev gulp-imagemin
  2. Add const imagemin = require('gulp-imagemin'); on top of gulpfile.js after var gulp = require('gulp');
  3. Add in the end of the gulpfile.js:
    • gulp.task('minify-images', function() {
    • gulp.src('{your_images_directory_path}}/*')
    • .pipe(imagemin())
    • .pipe(gulp.dest('dist/images'))
    • });
  4. Run all tasks: gulp.task(['task1_name', 'task2_name', 'task3_name']);

After that you need to restart Gulp and re-run gulp command again on the Terminal.

This is the end of this tutorial. Of course gulp is huge and can be used to do whatever you like so check the links and add to the above process.

Enjoy!

Resources:
The top image was downloaded from:https://alpha.wallhaven.cc
Stream Handbook: https://github.com/substack/stream-handbook
Gulp: http://gulpjs.com/

How to install Zurb’s Foundation 6 with SASS compiler using the CLI on an Ubuntu PC p.1

When it comes to Web Development writing pure code Zurb’s Foundation 6 is one of the most reliable and easy to use Frameworks.

Foundation 6 provides the user with all the necessary tools to build a modern fully responsive Web Site.

The API starts showing its capabilities very soon, but what makes it rocket is the CLI functionality it provides.

For a beginner user this might look overwhelming, but in fact there is no reason to avoid the CLI. In fact propably you will come against the necessity to use it very soon. This will be the case if you try to customize an Orbit Slider or use the powerfull SASS styling language.

Our case study is that we need to install Foundation 6 on our computer in order to start our new super Responsive Web Site:

So the question is why i write this Tutorial since there is the Official Zurb Page that describes the process thoroughly? The answer is that i will try to create a Working Environment that will make you feel really professional and Boost your Creativity:

  1. Synchronize your browser to reflect your code the moment you click SAVE
  2. Set up GULP to do some automated work for you

Also always be carefull and prefer using the 2 below tips:

  1. Read carefully the possible errors the Terminal gives you and install all the missing dependencies (if any)
  2. Don’t forget to use sudo in all your commands

I will try to keep the Tutorial short in order to show the simplicity of the process and to provide with an easy to use reference to everybody that needs to build a new project and needs all the commands in one place.

We will need to access the Ubuntu Terminal Ctrl+Alt+T.

Foundation 6 template setup requires nodejs and git. Install these via apt-get or whatever package manager, or download from nodejs.org and git-scm.com

  1. $sudo apt-get install node
  2. $sudo apt-get install git
  3. $sudo npm -gS install bower
  4. $sudo npm install --global foundation-cli
  5. run as user in a project parent directory: mkdir project_folder $ cd project_folder
  6. $ foundation new
  7. Choose Foundation for sites default template and name your project newproject
  8. $ cd newproject
  9. $ foundation watch: This will watch for any SCSS changes and update the app.css file.

  10. Now we will install the Browser Sync functionality. We need to open a new Terminal tab, press Ctrl+Shift+T over a Terminal window to open a new Terminal Tab and type: browser-sync start --server --files "**/*" and let it reflect all our code alterations on the Browser. This will open a tab in our default browser. So basically we have 2 Terminal Tabs working in the same time and updating every time we click SAVE

  11. Now we are ready to start programming, but before that we need to add some more lines. We need to create a _custom.scss file inside the scss folder and then import it to the scss/app.scss with the command @import 'custom'; without the _ or the extension on the top of the file.

  12. We are Finished!!!. Now we can write our code in index.html and click SAVE, this will refresh the browser window automatically and compile CSS into SASS that you can see inside the css/app.css file

I will setup GULP and show you how to minify JS and CSS and perform various tasks in the next Tutorial.

Hope you enjoy the tutorial and take advantage of this great Zurb’s Framework that can really make your life easier.

Have a great 2017 and let me know of any questions through the commenting system.

Resources:
The top image was downloaded from:https://alpha.wallhaven.cc
Browser Sync: https://www.browsersync.io/
Usefull info: http://foundation.zurb.com/sites/docs/