Difference between revisions of "Setup Your Development Environment"

From Wiki | Valse Technologies
Jump to navigation Jump to search
(Created page with "START HERE: ********************************* 1. Install Atom ide x64 ********************************* Install atom-beautify, php-cs-fixer, ide-php, livereload, intentions...")
 
Line 1: Line 1:
 
START HERE:
 
START HERE:
  
 +
<nowiki>================================================</nowiki>
  
 +
1. Install Atom ide x64
  
*********************************
+
<nowiki>================================================</nowiki>
1. Install Atom ide x64
 
*********************************
 
Install atom-beautify, php-cs-fixer, ide-php, livereload, intentions, busy-signal, linter and linter-ui-
 
  
default.
 
  
atom-beautify>setting
+
*First need to install important packages before using Atom ide. File > Settings > Click Install, use search box under Install Packages, search for atom-beautify > Click install. Then search php-cs-fixer > Click Install.
executable>php first file directory copy wampstack php file directory path put \php.exe
+
Search ide-php > Click Install.
              second file directory copy user (name) .atom packages php-cs-fixer file directory path
+
Search livereload > Click Install.
      (find https://github.com/FriendsOfPHP/PHP-CS-Fixer and download php-cs-fixer.phar
+
Search intentions > Click Install.
      and copy it into user (name) .atom packages php-cs-fixer file directory path and copy
+
Search busy-signal > Click Install.
 +
Search linter > Click Install.
 +
Search linter-ui-default > Click Install.
  
"php-cs-fixer.phar" to the file directory path
 
php>beautify on save and tick it
 
CSS>beautify on save and tick it
 
HTML>beautify on save and tick it
 
  
ide-php>setting fourth file directory copy wampstack php file directory path put \php.exe
+
*File > Settings > Packages > Search Atom-beautify and click settings > Search executable and drop down it > find PHP and click it > Before that, open your Bitnami folder and search for php.exe in php folder > Copy the directory, example D:\Program\Bitnami Wamp\php\php.exe or D:\Program\Bitnami Wamp\wampstack(version)\php\php.exe and then paste the directory into PHP Binary/Script Path
livereload>setting tick both apply image live and auto start server
 
php-cs-fixer>setting first file directory copy wampstack php file directory path put \php.exe
 
  
Update settings in Atom
 
========================
 
File > Config > Settings > Core
 
Send telemetry to the atom team section
 
Do not send any telemetry data
 
Packages type welcome click setting
 
tick off show on startup
 
Packages find line-ending-selector
 
find default line ending and choose LF
 
  
 +
*Second is search and download file "php-cs-fixer.phar" from https://github.com/FriendsOfPHP/PHP-CS-Fixer and paste into your directory path for example, C:\Users\asus\.atom\packages\php-cs-fixer > Then File > Settings > Packages > Search Atom-beautify and click settings > Find PHP-CS-Fixer, it is below PHP > Paste the directory example C:\Users\asus\.atom\packages\php-cs-fixer\php-cs-fixer-v2.phar
  
  
************************************
+
*After that go to settings in atom ide and packages > atom-beautify. Search for PHP, CSS and HTML //scroll down
 +
PHP>beautify on save and tick it // scroll down below > search for PHP, Click check button beautify on save
 +
CSS>beautify on save and tick it // scroll down below > search for CSS, Click check button beautify on save
 +
HTML>beautify on save and tick it // scroll down below > search for HTML, Click check button beautify on save
 +
 
 +
 
 +
*Fourth is go to settings > packages > ide-php and click settings > find the PHP Path and copy and paste the directory for example
 +
D:\Program\Bitnami Wamp\php\php.exe
 +
Go to settings > packages > livereload and click settings > tick  apply image live and auto start server.
 +
Go to settings > packages > php-cs-fixer and click settings > find the PHP Path and copy and paste the directory for example
 +
D:\Program\Bitnami Wamp\php\php.exe
 +
 
 +
 
 +
*Last part is to update settings in Atom
 +
File > Settings > Core > Search for Send to telemetry to the atom team section > Change to Do not send any telemetry data
 +
File > Settings > Packages > Search welcome > Click settings below welcome packages > scroll down and untick Show on Startup
 +
File > Settings > Packages > Search line-ending-selector > Click settings below it > find default line ending and change to LF
 +
File > Config > Settings > Core //this is to view if setting has changed or not
 +
 
 +
 
 +
 
 +
 
 +
<nowiki>================================================</nowiki>
 +
 
 
2. Then register in gitlab.com
 
2. Then register in gitlab.com
************************************
 
  
Fill in the form and follow the registration procedure
+
<nowiki>================================================</nowiki>
 +
 
 +
 
 +
*Fill in the form and follow the registration procedure
  
Check for git gui in your PC, if you don't have it then install it from  
+
Check for git gui in your PC, if you don't have it then install it from
 
https://www.linode.com/docs/development/version-control/how-to-install-git-on-linux-mac-and-windows/
 
https://www.linode.com/docs/development/version-control/how-to-install-git-on-linux-mac-and-windows/
  
Line 55: Line 66:
  
  
*******************************
+
<nowiki>================================================</nowiki>
 +
 
 
3. WAMP Installation
 
3. WAMP Installation
*******************************
 
 
If you have wampserver in your PC, remove the wampserver in control panel>program features.
 
  
Go to https://bitnami.com/stack/wamp choose WAMP 7.0.32-2 64-bit 199MB windows 64-bit.
+
<nowiki>================================================</nowiki>
  
After install the Bitnami.
 
  
 +
If you have wampserver in your PC, remove the wampserver in control panel>program features. Go to https://bitnami.com/stack/wamp choose WAMP 7.0.32-2 or newer version 64-bit 199MB windows 64-bit. After install the Bitnami.
 
Choose manage server :-
 
Choose manage server :-
  
Line 72: Line 81:
  
  
WAMPSERVER SETUP
+
*WAMPSERVER SETUP
================
 
  
Go to C:\Bitnami\wampstack-7.0.32-2\apache2\conf
+
Go to C:\Bitnami\wampstack-7.0.32-2\apache2\conf; copy httpd.conf for backup, add BAK to the file name, after backup and drag the httpd.conf on to atom
copy httpd.conf for backup, add BAK to the file name
 
after backup and drag the httpd.conf on to atom
 
  
HTTPD.CONF
 
  
in this section (Change this to Listen on specific IP addresses as shown below to
+
*HTTPD.CONF
prevent Apache from glomming onto all bound IP addresses.) below Listen 81 add Listen 8000 and leave a
 
  
space below (important)
+
In this section (Change this to Listen on specific IP addresses as shown below to prevent Apache from glomming onto all bound IP addresses.) below Listen 81 add Listen 8000 and leave a space below (important)
  
in ServerAdmin section change the server admin below to your valse mail address
+
In ServerAdmin section change the server admin below to your valse mail address for example; your.email@valse.com.my
  
in (Deny access to the entirety of your server's filesystem) section change none to All and below place #  
+
In (Deny access to the entirety of your server's filesystem) section change none to All and below place #
 +
to comment it
  
to comment it
+
In (Controls who can get stuff from this server.) section put Order allow,deny and Allow from all
 +
above the Required all granted and comment the following line with #Require all granted or delete it
  
in (Controls who can get stuff from this server.) section put Order allow,deny and Allow from all above
+
Example shown below
  
Required all granted and comment the following line with #
+
  Order allow,deny
 +
  Allow from all
 +
</Directory>
  
in (<Directory "C:/Bitnami/wampstack-7.0.32-2/apache2/cgi-bin">) section change none to All and comment  
+
In (<Directory "C:/Bitnami/wampstack-7.0.32-2/apache2/cgi-bin">)//use ctrl+f to find the directory on httpd.conf;
 +
section change none to All and comment the two lines below
  
the two lines below
+
Go to C:\Bitnami\wampstack-7.0.32-2\apache2\conf\extra; copy httpd-vhosts.conf for backup, add BAK to the file name, after backup and drag the httpd-vhosts.conf on to atom
  
Go to C:\Bitnami\wampstack-7.0.32-2\apache2\conf\extra
+
in httpd.conf search loadmodule section uncomment vhost_alias_module modules/mod_vhost_alias.so and in virtual host section uncomment Include conf/extra/httpd-vhosts.conf
copy httpd-vhosts.conf for backup, add BAK to the file name
 
after backup and drag the httpd-vhosts.conf on to atom
 
  
HTTPD-VHOSTS.CONF
+
*HTTPD-VHOSTS.CONF
  
 
in virtual host section comment the first virtualhost table
 
in virtual host section comment the first virtualhost table
 
the second table change 80 to 8000
 
the second table change 80 to 8000
change server admin mail to your valse mail
+
change server admin mail to your valse mail for example; your.email@valse.com.my
Document root change the current directory to your repository directory
+
Document root change the current directory to your repository directory for example; D:/Workspace/Repository
 
server name change to localhost
 
server name change to localhost
 
remove error log and custom log
 
remove error log and custom log
put <Directory "">
+
put <Directory "">
 
         AllowOverride All
 
         AllowOverride All
 
         Order allow,deny
 
         Order allow,deny
Line 119: Line 126:
 
and put your repository directory on directory section ("")
 
and put your repository directory on directory section ("")
  
go to https://docs.gitlab.com/ee/gitlab-basics/start-using-git.html
+
Example shown below
find git --version section and new tab download.git
 
find installing window section and create new tab on the download link
 
install git and everything default
 
  
in loadmodule section uncomment vhost_alias_module modules/mod_vhost_alias.so
+
UseCanonicalName Off
and in virtual host section uncomment Include conf/extra/httpd-vhosts.conf
+
#<VirtualHost *:80>
 +
    #ServerAdmin webmaster@dummy-host.example.com
 +
    #DocumentRoot "D:/Program/Bitnami Wamp/apache2/docs/dummy-host.example.com"
 +
    #ServerName dummy-host.example.com
 +
    #ServerAlias www.dummy-host.example.com
 +
    #ErrorLog "logs/dummy-host.example.com-error.log"
 +
    #CustomLog "logs/dummy-host.example.com-access.log" common
 +
#</VirtualHost>
  
comment the virtual host 8000
+
<VirtualHost *:8000>
and put UseCanonicalName Off
 
<VirtualHost *:8000>
 
 
     ServerAdmin ***
 
     ServerAdmin ***
 
     DocumentRoot "***"
 
     DocumentRoot "***"
Line 138: Line 147:
 
         Allow from all
 
         Allow from all
 
     </Directory>
 
     </Directory>
</VirtualHost>
+
</VirtualHost>
<VirtualHost *:8000>
+
<VirtualHost *:8000>
 
     ServerAlias *.localhost
 
     ServerAlias *.localhost
 
     VirtualDocumentRoot "***/%1/"
 
     VirtualDocumentRoot "***/%1/"
</VirtualHost>
+
</VirtualHost>
 +
 
  
and then restart apache in bitnami and localhost:8000 should show forbidden
+
Then restart apache in bitnami and localhost:8000 should show forbidden
 
Find C:\Windows\System32\drivers\etc in your PC
 
Find C:\Windows\System32\drivers\etc in your PC
 
Backup the host file
 
Backup the host file
 +
 +
go to https://docs.gitlab.com/ee/gitlab-basics/start-using-git.html
 +
find git --version section and new tab download.git
 +
find installing window section and create new tab on the download link
 +
install git and everything default
 +
  
 
++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
 
++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
 +
 
exclude line
 
exclude line
 +
 
++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
 
++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
  
Line 200: Line 218:
  
  
****************************************************************
+
<nowiki>****************************************************************</nowiki>
 +
 
 
4. Installation of MySQLworkbench 8.0 ce (community edition)
 
4. Installation of MySQLworkbench 8.0 ce (community edition)
****************************************************************
+
 
 +
<nowiki>****************************************************************</nowiki>
 +
 
 +
 
 
Go to https://dev.mysql.com/downloads/workbench/
 
Go to https://dev.mysql.com/downloads/workbench/
  

Revision as of 09:31, 5 August 2019

START HERE:

================================================

1. Install Atom ide x64

================================================


  • First need to install important packages before using Atom ide. File > Settings > Click Install, use search box under Install Packages, search for atom-beautify > Click install. Then search php-cs-fixer > Click Install.
Search ide-php > Click Install.
Search livereload > Click Install.
Search intentions > Click Install.
Search busy-signal > Click Install.
Search linter > Click Install.
Search linter-ui-default > Click Install.


  • File > Settings > Packages > Search Atom-beautify and click settings > Search executable and drop down it > find PHP and click it > Before that, open your Bitnami folder and search for php.exe in php folder > Copy the directory, example D:\Program\Bitnami Wamp\php\php.exe or D:\Program\Bitnami Wamp\wampstack(version)\php\php.exe and then paste the directory into PHP Binary/Script Path


  • Second is search and download file "php-cs-fixer.phar" from https://github.com/FriendsOfPHP/PHP-CS-Fixer and paste into your directory path for example, C:\Users\asus\.atom\packages\php-cs-fixer > Then File > Settings > Packages > Search Atom-beautify and click settings > Find PHP-CS-Fixer, it is below PHP > Paste the directory example C:\Users\asus\.atom\packages\php-cs-fixer\php-cs-fixer-v2.phar


  • After that go to settings in atom ide and packages > atom-beautify. Search for PHP, CSS and HTML //scroll down
PHP>beautify on save and tick it // scroll down below > search for PHP, Click check button beautify on save
CSS>beautify on save and tick it // scroll down below > search for CSS, Click check button beautify on save
HTML>beautify on save and tick it // scroll down below > search for HTML, Click check button beautify on save


  • Fourth is go to settings > packages > ide-php and click settings > find the PHP Path and copy and paste the directory for example
D:\Program\Bitnami Wamp\php\php.exe
Go to settings > packages > livereload and click settings > tick  apply image live and auto start server.
Go to settings > packages > php-cs-fixer and click settings > find the PHP Path and copy and paste the directory for example
D:\Program\Bitnami Wamp\php\php.exe


  • Last part is to update settings in Atom
File > Settings > Core > Search for Send to telemetry to the atom team section > Change to Do not send any telemetry data
File > Settings > Packages > Search welcome > Click settings below welcome packages > scroll down and untick Show on Startup
File > Settings > Packages > Search line-ending-selector > Click settings below it > find default line ending and change to LF
File > Config > Settings > Core //this is to view if setting has changed or not



================================================

2. Then register in gitlab.com

================================================


  • Fill in the form and follow the registration procedure

Check for git gui in your PC, if you don't have it then install it from https://www.linode.com/docs/development/version-control/how-to-install-git-on-linux-mac-and-windows/

Create New folder and name it Repository in work drive in any folder you create for it.

Choose create repository and browse for your Repository folder.

All projects will reside here. No action needed for now.



================================================

3. WAMP Installation

================================================


If you have wampserver in your PC, remove the wampserver in control panel>program features. Go to https://bitnami.com/stack/wamp choose WAMP 7.0.32-2 or newer version 64-bit 199MB windows 64-bit. After install the Bitnami. Choose manage server :-

mysql>configure>change 3306 to 3307 and restart it

apache>configure>change 80 to 81 and restart it


  • WAMPSERVER SETUP

Go to C:\Bitnami\wampstack-7.0.32-2\apache2\conf; copy httpd.conf for backup, add BAK to the file name, after backup and drag the httpd.conf on to atom


  • HTTPD.CONF
In this section (Change this to Listen on specific IP addresses as shown below to prevent Apache from glomming onto all bound IP addresses.) below Listen 81 add Listen 8000 and leave a space below (important)

In ServerAdmin section change the server admin below to your valse mail address for example; your.email@valse.com.my

In (Deny access to the entirety of your server's filesystem) section change none to All and below place # to comment it

In (Controls who can get stuff from this server.) section put Order allow,deny and Allow from all above the Required all granted and comment the following line with #Require all granted or delete it

Example shown below

  Order allow,deny
  Allow from all
</Directory>

In (<Directory "C:/Bitnami/wampstack-7.0.32-2/apache2/cgi-bin">)//use ctrl+f to find the directory on httpd.conf; section change none to All and comment the two lines below

Go to C:\Bitnami\wampstack-7.0.32-2\apache2\conf\extra; copy httpd-vhosts.conf for backup, add BAK to the file name, after backup and drag the httpd-vhosts.conf on to atom

in httpd.conf search loadmodule section uncomment vhost_alias_module modules/mod_vhost_alias.so and in virtual host section uncomment Include conf/extra/httpd-vhosts.conf

  • HTTPD-VHOSTS.CONF

in virtual host section comment the first virtualhost table the second table change 80 to 8000 change server admin mail to your valse mail for example; your.email@valse.com.my Document root change the current directory to your repository directory for example; D:/Workspace/Repository server name change to localhost remove error log and custom log

put <Directory "">
       AllowOverride All
       Order allow,deny
       Allow from all
   </Directory>

and put your repository directory on directory section ("")

Example shown below

UseCanonicalName Off
#<VirtualHost *:80>
   #ServerAdmin webmaster@dummy-host.example.com
   #DocumentRoot "D:/Program/Bitnami Wamp/apache2/docs/dummy-host.example.com"
   #ServerName dummy-host.example.com
   #ServerAlias www.dummy-host.example.com
   #ErrorLog "logs/dummy-host.example.com-error.log"
   #CustomLog "logs/dummy-host.example.com-access.log" common
#</VirtualHost>
<VirtualHost *:8000>
   ServerAdmin ***
   DocumentRoot "***"
   ServerName localhost
   <Directory "***">
       AllowOverride All
       Order allow,deny
       Allow from all
   </Directory>
</VirtualHost>
<VirtualHost *:8000>
   ServerAlias *.localhost
   VirtualDocumentRoot "***/%1/"
</VirtualHost>


Then restart apache in bitnami and localhost:8000 should show forbidden Find C:\Windows\System32\drivers\etc in your PC Backup the host file

go to https://docs.gitlab.com/ee/gitlab-basics/start-using-git.html find git --version section and new tab download.git find installing window section and create new tab on the download link install git and everything default


++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++

exclude line

++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++

Run Notepad as Administrator Load the C:\Windows\System32\drivers\etc\host in the Notepad

Add these lines at the bottom of the file

127.0.0.1 valse-vivace-framework.localhost

valse-vivace-framework.localhost should be replaced with any project folder

E.g. if new project is D:\Repository\kengdim, then you should add: 127.0.0.1 kengdim.localhost

Look for the project URL in Gitlab.com E.g. https://gitlab.com/valsetech/valse-vivace-framework


Reference for Git connect: http://www.ntu.edu.sg/home/ehchua/programming/howto/Git_HowTo.html

Under "3.3 Cloning a Project from a Remote Repo (git clone <remote-url>)"

Put your Gitlab (username) and password

So in short, need to 1) create database 2) import MVC / Vivace SQL into database 3) create database user 4) link database user to database (grant all privileges)

remember, if local PC / laptop, your environment is always SIT

on your right you will see Unstaged Changes. So what you need to do is make it to Staged

Everytime you want to upload, must put in commit message. It must explain what you did. Understand?meow

So...

0) Click Fetch button on bottom right (this is similar to download) 1) Make code changes 2) Click on "Stage all" to stage the file changes 3) Write commit message 4) Click on "Commit to master" 5) Click on Push on bottom right (this is similar to upload)



****************************************************************

4. Installation of MySQLworkbench 8.0 ce (community edition)

****************************************************************


Go to https://dev.mysql.com/downloads/workbench/

Look for Windows (x86, 64-bit), MSI Installer (mysql-workbench-community-8.0.13-winx64.msi)

Choose No thanks, just start my download.