[2018-01-07 / 08 – Sun / Mon]
Setting up a new VirtualBox VM with Ubuntu 16.04.3 (guest) on a Windows 10 MSI laptop (host/parent).
I was recently reintroduced with Foundation 6, and I decided it would be a good opportunity for a little redesign of my portfolio. This guide became a byproduct of my setup process.
Note: In this guide, ‘ubuntuuser’ will be the local Ubuntu username you choose when creating your VirtualBox Ubuntu VM (bullet item #2). Also, I tried to put all the important commands to run in bold – hopefully this translates when I publish from Evernote to Blogger. 🙂
VM with Foundation 6 from Scratch:
– Downloaded Ubuntu Server Latest (16.04.3) ISO
– Created a new VirtualBox VM (named "F18").
Apply the ISO, run through the Ubuntu installation (I accept near, if not all, defaults).
LAMP server | Mail server | Samba file server | OpenSSH server | Basic Ubuntu server
(names and passes are just suggestions; please don’t use them verbatim.)
Server Name: [myubuntu]
Ubuntu Admin User & Pass: [ubuntuuser][aweSumPas^sW8rk]
MySQL Root User: [giv#AGoodPawswd]
(^^^ watch this; it kind of looks like it wants a pass for
your Ubuntu root user, but it’s for the MySQL root user.)
sudo apt-get update
sudo apt-get upgrade (new install; could take a little while)
sudo apt-get update
– We need Git
sudo apt-get install git
git config –global user.email "your@gitemail.com"
git config –global user.name "Your GitHub or BitBucket or XyZ Name"
– Created GitHub Public Repo
No license (implied self-copyright)
Updated Readme.md to reflect WIP
– We need the framework
– Didn’t install Foundation CLI (just did the clone thing…)
git clone https://github.com/zurb/foundation-zurb-template kdcF6
Edited package.json to be my own name, Git location, etc.
– Setup WinSCP connection
[connect to SFTP:22 myubuntu|ubuntuuser]
[chmod] (d-755/f-644) to all files/folders* inside kdcF6 (wherever you put your F6 files)
*I left the .git folder alone.
(Selective multi-file and folder selection inside GUI is easier than via cmd line.)
– Ran through setting up ‘nvm’ and node
nvm – creationix
wget -qO- https://raw.githubusercontent.com/creationix/nvm/v0.33.8/install.sh | bash
libssl-dev build-essential / build-essential
sudo apt-get -y install libssl-dev build-essential
sudo mkdir /tmp/node-install
cd /tmp/node-install
sudo wget {paste}
node-install – Beware pipe ( | ) command separators | Inserted only for brevity.
sudo tar -zxf {tab} | cd {tab} | sudo chmod -R 770 /tmp/node-install/{tab} |
sudo ./configure | sudo make (takes awhile) | sudo make install |
node -v | cd / | sudo rm -r /tmp/node-install/
Current Node at time of downloading from "Source Code"
– Ran: sudo npm install
The moment we’ve all been waiting for…
Failed! Permissions issue.
First I found and tried:
sudo chown -R $(whoami) $(npm config get prefix)/{lib/node_modules,bin,share}
That condensed cmd did not behave well, so ended up doing them separately:
sudo chown -R $(whoami) /usr/local/lib/node_modules/
sudo chown -R $(whoami) /usr/local/bin/
sudo chown -R $(whoami) /usr/local/share/
Then I found and ran:
sudo npm cache clear
sudo npm cache verify
sudo npm cache clear –force
sudo chgrp -R root /home/ubuntuuser/.npm/
sudo chown -R ubuntuuser /home/ubuntuuser/.npm/
ll /home/ubuntuuser/.npm/
Last thing, should go ahead and do before npm install…
When [npm install] is run first, it will end with a message suggesting:
sudo chown -R $USER:$(id -gn $USER) /home/ubuntuuser/.config
npm start
^— Look ma, no sudo!!!
We’ve got take-off!
http://myubuntu/foundation/f6/dist/
Note: Because I did not install the Foundation-CLI, you may notice I’m not running "foundation watch", but "npm start". These are the same thing (‘foundation watch’ is an alias).
Note: In the 2+ years I’ve been running these Ubuntu setups, this is the first time in an Ubuntu environment I’ve been able to, (had to, in fact,) run ‘npm’ without ‘sudo’.
Running in a server-only terminal.
– Looking into turning off BrowserSync (or see if I can enable it to run outside of my headless server).
– Or I can install Ubuntu Desktop as I did on my (old?) primary VM.
Suggestion was to set: open = false
Found it! (added open: false)
[gulpfile.babel.js]
function server(done) {
browser.init({
server: PATHS.dist, port: PORT,
open: false
});
done();
}
And we’ve got an even Better Take-Off !!!
http://192.168.43.95:8000 (ran this from my Win 10 host – BrowserSync connected!!!)
And we’ve got control over our take-offs !!!
Setup Samba Sharing:
sudo vi /etc/samba/smb.conf
[VMCode]
path = /var/www/html/
available = yes
valid users = ubuntuuser
read only = no
browsable = yes
public = no
writable = yes
sudo smbpasswd -a ubuntuuser
sudo service smbd restart
Initial Issues: I had major issues with my first VirtualBox VM (named "Foundation") whereby I set up the hard drive to be dynamic, but it set itself to 10GB. Even after updating it to 20GB via the VM Media Manager, Ubuntu would not see the changes.
– Spent Sunday going over documentation, watched 6 videos, and got initial VM with Foundation 6 setup.
Problem came when trying to setup a 2nd Foundation project.
– Ran out of space on 2nd install of Foundation (tried 5+ times).
– Spent most of Monday trying to get drive expanded in initial "Foundation" VM.
Used often: sudo npm cache clear
Editors Note: You will see that I used multiple tenses, and I apologize for that, but I primarily just wanted to get the overall (but primary) gist of it all documented.
A little further: In addition to using Foundation 6, because React requires its own server, I may be introducing a little Vue into these otherwise static LAMP pages. Maybe… Hopefully…
Some References:
Warning: Please do not blindly copy and paste any of this code. Always know what you’re entering, even if it means looking up every other word until you grasp it. Or, ask. Although I’m only a mid-level Front-End Engineer, comments and questions are still welcome.
—
Keith D Commiskey
https://keithdc.com
Keith D Commiskey
https://keithdc.com