vrijdag 17 augustus 2018

Trying to install Gogs on Ubuntu 16.04 - A journey

Trying to install Gogs on an Ubuntu server is not as easy as it seems if all the conditions are not peacy perfect. I wen through the hoops, and I documented them here hoping that you will find it easier to jump through them instead of having to find several parts of answers scattered around the internet like I had.

So my current stats: Ubuntu 16.04, MariaDB 10.0, Nginx something

First off:

Upgrading your Maria db.

How to do that is copied from https://websiteforstudents.com/upgrading-mariadb-from-10-0-to-10-1-to-10-2-on-ubuntu-16-04-17-10/ but copied here in case it goes down/vanishes etc.. like stuff on the internet likes to do, but do visit that site, it has tons of useful information.

This is assuming you have a mariadb installation already present at a lower version than 10.2, if you don't have it yet just skip to the 10.2 step.

First off log onto your database.

sudo mysql -u root -p Run the following command
mysql> SET GLOBAL innodb_fast_shutdown = 0; Make a backup of your databases if needed to be then stop the mysql service

Ubuntu 16.04sudo systemctl stop mysql.service On Ubuntu 17.10 and up, run the command below: sudo systemctl stop mariadb.service
Now remove the Maria DB server from your system.sudo apt remove mariadb-server In stall the software properties and the keys.
sudo apt-get install software-properties-common
sudo apt-key adv --recv-keys --keyserver hkp://keyserver.ubuntu.com:80 0xF1656F24C74CD1D8
Now we do the upgrade shuffle. I read in several places it was best to do the upgrade in steps to keep database integrity, so first upgrading to 10.1 and then then 10.2. If you like to live dangerously upgrade right away to 10.2.
sudo sh -c "echo 'deb [arch=amd64,i386] https://mirrors.evowise.com/mariadb/repo/10.1/ubuntu '$(lsb_release -cs)' main' > /etc/apt/sources.list.d/MariaDB-10.1.list"
sudo apt-get update
sudo apt-get install mariadb-server
Now to upgrade your databases to 10.1
sudo mysql_upgrade
If you happen to get the below error message:
ERROR 1524 (HY000): Plugin 'unix_socket' is not loaded
FATAL ERROR: Upgrade failed
You will need to follow the steps as laid out on https://websiteforstudents.com/fix-mariadb-plugin-unix_socket-is-not-loaded-error-on-ubuntu-17-04-17-10/

sudo nano /etc/mysql/mariadb.conf.d/50-server.cnf Then add the line below right below the [mysqld] marker.plugin-load-add = auth_socket.so After adding the line into the file, run the commands below to restart Maria DB sudo systemctl restart mariadb.service
Then try to run the upgrade command again
sudo mysql_upgrade
When the upgrade command has completed we are going to do the tricks again to upgrade to 10.2sudo systemctl stop mysql.service sudo apt remove mariadb-server sudo sh -c "echo 'deb [arch=amd64,i386] https://mirrors.evowise.com/mariadb/repo/10.2/ubuntu '$(lsb_release -cs)' main' > /etc/apt/sources.list.d/MariaDB-10.2.list" sudo apt-get update sudo apt-get install mariadb-server mariadb-client sudo systemctl restart mariadb.service sudo mysql_upgrade And now we have a Maria DB upgrade complete.
We needed this upgrade because otherwise there are going to be problems with database keys being too big and you getting an error like Error 1071: Specified key was too long; max key length is 767 bytes or like Error 1071: Specified key was too long; max key length is 1000 bytesBut when we're at Mariadb 10.2 we're good to go, that error doesn't happen.

Now to install Gogs. 

I chose to install via packages, you can decide another method but then you're on your own unfortunately.

 According to the installation page https://gogs.io/docs/installation/install_from_packages they supply their packages via packager.io which leads us to this wonderful overview https://packager.io/gh/pkgr/gogs

There I clicked on the Ubuntu 16.04 icon of the most recent package to get to the installation instructions
https://packager.io/gh/pkgr/gogs/builds/687/install/ubuntu-16.04


wget -qO- https://dl.packager.io/srv/pkgr/gogs/key | sudo apt-key add - sudo wget -O /etc/apt/sources.list.d/gogs.list \ https://dl.packager.io/srv/pkgr/gogs/pkgr/installer/ubuntu/16.04.repo sudo apt-get update sudo apt-get install gogsIf for some reason it doesn't run on the first try you'll might have to run this command first.apt-get install wget apt-transport-https We have Gogs now, we have an upgraded Maria DB, we already had an Nginx.
After this warm up let's try to party and actually start setting things up.

Setting up the database

We need a database set up for Gogs, so lets set up a user and database for it. mysql -uroot -p create database gogs; create user gogs; grant privileges on gogs.* to `gogs`@`localhost` identified by 'a_fancy_password_here'; exit
Being able to see Gogs

Now we need to have access to Gogs. Default Gogs will run it's configure server on port 6000. Default this will be blocked by Chrome and Firefox with ERR_UNSAFE_PORT.
We can't access Gogs yet to put in our database credentials. Unless you're fine working with internet explorer. That'll work with port 6000 just fine and dandy, or you wish to fiddle with your chrome settings to allow port 6000, but you'll have to remember to do that with every chrome you'll work with.

Up to nginx configuration: cd /etc/nginx/sites-available sudo nano gogs And insert there the following code(I chose port 8080 since it's whitelisted by chrome and I have other things running on 80, but do as you please): server { listen 8080; server_name your_server_name_here; location / { proxy_pass http://localhost:6000; } } Press CTRL + X to exit and answer yes on the question if you wish to save.
 Now we need to make a symlink to sites enabled sudo ln -s /etc/nginx/sites-available/gogs /etc/nginx/sites-enabled/gogs Now to restart Nginx to have our server up and running sudo service nginx restart Now browse to your website at http://your-domain:8080 and you should see all the configuration settings you can enter for Gogs.

If you can't see it or you get a connection refused, you might need to whitelist port 8080 in your firewall:

ufw allow 8080/tcp
And that's how it's made "easy" to set up Gogs :-)

donderdag 8 maart 2018

How to use html5 <template> with jQuery

So you have decided to go full html5 in your website. Congrats, welcome to 2018 where Internet Explorer is closer to death.


 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
<!-- Learn about this code on MDN: https://developer.mozilla.org/en-US/docs/Web/HTML/Element/template -->

<table id="producttable">
  <thead>
    <tr>
      <td>UPC_Code</td>
      <td>Product_Name</td>
    </tr>
  </thead>
  <tbody>
    <!-- existing data could optionally be included here -->
  </tbody>
</table>

<template id="productrow">
  <tr>
    <td class="record"></td>
    <td></td>
  </tr>
</template> 


Now if you wish to use template, but don't wish to use the code that's shown on MDN because you are more comfortable with jquery, you only need this one sentence to get the template into a jQuery object you can manipulate and later append to your favorite node.

The full sample for createing, modifying and appending a node from a template.


1
2
3
4
$content = $(document.importNode($('template#productrow').prop('content'), true));
$content.find('td.record').text('foo');
$content.find('td:not(.record)').text('bar');
$('#producttable thead').append($content);

You can fiddle with it here: https://jsfiddle.net/Ld9421o1/

Now a little breakdown of what does what

This is the entire line needed to turn a template into a jquery object you can manipulate.

1
var $content = $(document.importNode($('template#productrow').prop('content'), true));
Below the breakdown of the individual components

This searches a <template> element with the id attribute with the value productrow.
Then it accesses the property 'content' on that object.

1
$('template#productrow').prop('content')
An alternative could be

1
2
$('template#productrow').get(0).content;
$('template#productrow')[0].content;
The document-fragment you have now is not attached to the window.document object. It's free floating without parents. This also means you can't append it to any node you have on your document.

This is why you call this code. What it does is clone the fragment you have supplied(that's what the true is for) setting window.document to the documents fragment parent, but it's still not attached to any DOM element you have in your body. It is as if you called $('selector').detach() on an element.
And then it returns the cloned node to you.
1
document.importNode(documentFragment, true)

Now we wrap the clone in jQuery so we have a nice manipulatable object we can change without changing the template around and because it's still detached from the DOM, these manipulations will happen really fast because there's no re-rendering of the page involved.

1
$(document.importNode(documentFragment, true))