Redmine eta Git Errepositorioen Uztartzea

Redmine tresnak Git errepositoriekiko bateragarritasun osoa eskaintzen du. Trebetasun honek proiektuen garapen prozesuaren jarraipen zehatzeagoa eskaintzen du.

Proiektu baten ataza-jarraipena git errepositorio batekin uztartzeko, lehenik eta behin errepositorio berri bat jarri beharko dugu martxan. Gure kasuan Redmine aplikazioarentzat berezkoak izango diren jatorri errepositorioen klon-ak erabiliko ditugu.

Lehenik eta behin errepositorio berrien gordailua sortuko dugu

1
2
3
sudo mkdir -p /var/opt/redmine/git
sudo chown -R www-data:www-data /var/opt/redmine/git
cd /var/opt/redmine/git

ondoren errepositorio nagusiaren klona sortuko dugu, bertan egindako aldaketak Redmine tresnan isladatzeko asmoz

1
2
git clone --bare file:////var/opt/git/pictogram.git pictogram.git
git remote add origin file:////var/opt/git/pictogram.git

Hurrengo pausoa errepositorio fisikoa eta Redmine tresna uztartzea da. Horretarako Redmine tresnan kautotu eta uneko proiektuaren aukeretara joko dugu. Bertan Repository atalean, errepositorio berri bat sortzeko aukera eskaintzen da. Errepositorioaren kokalekua eskatzen den atalean sortu berri dugun errepositorioaren kokalekua ezarriko dugu. Bestelako aukerak norberaren beharretara hautatu eta aldaketak gorde ondoren, proiektua eta errepositorioa uztarturik egongo dira.

Git Zerbitzari Baten Muntaia

Post honen helburua garapenerako Git errepositorio zerbitzari bat martxan jartzea da. Horretarako Git, OpenSSH, Gitolite eta Gitweb tresnetaz baliatuko gara. Prozesu honetan OpenSSH eta Apache zerbitzariak dagoeneko martxan eta egoki konfiguraturik daudela aurreikusten da. Erabiliko dugun komando multzoa Ubuntu sistema batetara zuzendutakoak dira, beraz aldaketen beharra egon liteke beste linux sistemetara egokitzeko.

Git errepositorioa instalatu

Lehenik eta behin gure ubuntu sisteman Git tresna instalatuko dugu. Horretarako apt-get komandoaz baliatuko gara

1
sudo apt-get install git-core

Git erabiltzailea sortu eta konfiguratu

Git tresnarekin lan egingo duen erabiltzailea sortu eta konfiguratzea da hurrengo pausoa. Diseinatutako kautotze prozesuan erabiltzaile ugarirentzako sarbidea aurreikusten da. Lan hori ordea Gitolite tresnaren eskuetan utziko dugu. Erabiltzaile soil honen helburua SSH bidezko kautotze sistema arrunt eta segurua ahalbidetzea da.

1
2
3
4
5
6
7
8
sudo adduser \
    --system \
    --shell /bin/bash \
    --gecos 'Control de versiones' \
    --group \
    --disabled-password \
    --home /home/git \
    git
1
sudo passwd git

hurrengo urratsa erabiltzaileren home direktorioaren baimenak egokitzea izango da

1
sudo chmod o-rwx /home/git

emandako pausoak zuzenak izan direla egiaztatzeko erabiltzailearen kontuan kautotuko gara

1
su git

SSH sarbidea konfiguratu

Sortu berri dugun git erabiltzaileari SSH bidezko sarbidea gaituko diogu. Horretarako /etc/ssh/sshd_config fitxategian honako lerroa gehitu behar dugu (dagoeneko existitzen bada git testua gehitu besterik ez duzu)

1
AllowGroup git

Aldaketa honek git erabiltzailea SSH bidez bere pasahitza erabiliz sisteman kautotzea ahalbidetzen du. Gitolite tresna erabiltzeko ordea gako publiko bidezko kautotzea beharrezkoa da. Horretarako berriz ere sshd_config fitxategia editatu beharra dugu, dagokien  lerroei honako balioa esleituz:

RSAAuthentication yes
PubkeyAuthentication yes
AuthorizedKeysFile %h/.ssh/authorized_keys

aldaketak amaitu ostean sshd zerbitzaria berrabiaratuko dugu

1
sudo service ssh restart

Zerbitzaria gako publikoak onartzeko prest dagoen arren, git erabiltzaileari dagozkion konfigurazioak gehitzea ezinbestekoa da. Erabiltzaile bakoitzak baimendutako gako publiko bat baino gehiago izan dezakeenez, azpi-erabiltzaile ugarik pasahitzik partekatu gabe batera lan egiteko aukera izango dute.

Lehenik beharrezko konfigurazio direktorio eta fitxategiak sortuko ditugu

1
2
3
4
5
sudo mkdir /home/git/.ssh
sudo touch /home/git/.ssh/authorized_keys
sudo chown -R git:git /home/git/.ssh
sudo chmod 700 /home/git/.ssh
sudo chmod 600 /home/git/.ssh/authorized_keys

direktorio edo fitxategi hauek dagoeneko sortuak dauden kasuan edukia txuritu eta baimen egokiak ezarri beharko zaizkie.

Hurrengo pausua RSA gako publiko berri bat sortzea da. Komando honek uneko direktorioan gako publiko eta pribatu parea sortuko du. Kasu honetan erabiltzaile gisara git-admin ezizena erabiliko dugu:

1
ssh-keygen -t rsa -b 2048 -C "git-admin@[zerbitzari-izena]"

sortutako fitxategiak honakoak izango dira:

  • id_rsa: Erabiltzailearen gako pribatua. Bezero makinatik konexioak egikaritzeko balioko duena (ezinbestekoa da gako hau pribatu mantentzea)
  • id_rsa.pub:  Erabiltzailearen gako publikoa. Zerbitzarian gordeta egongo den gakoaren zati partekagarria.

Behin gakoa sortuta zati pribatua bezero makinara kopiatuko dugu eta zati publikoa zerbitzarian.

(Kontuan izan pauso hauek ez dutela dagoeneko gako bidezko sarbidea onartzen, horretarako gitolite tresna konfiguratu beharko dugu).

Gitolite tresna

Gitolitek errepositorioen gaineko baimenak gestionatzeko aukera eskaintzen du. Lehen pausoa sisteman instalatzea izango da.

1
sudo apt-get install gitolite

Ondoren Gitolite-ren konfigurazio prozesuari ekingo diogu. Lehenik, baimenen gestiorako administratzaile bat sortuko dugu aurreko pausuan sortutako gako publikoa erabiliz.

1
2
3
4
5
6
7
8
sudo su git
cd
git clone git://github.com/sitaramc/gitolite
mkdir -p $HOME/bin
gitolite/install -to $HOME/bin
echo "PATH=$HOME/bin:$PATH" > ~/.bashrc
source ~/.bashrc
gitolite setup -pk [sortutako-gako-fitxategia].pub

Gitweb errepositorio arakatzailea erabili nahi dugunez .gitolite.rc fitxategia editatu eta honako aldaketak egin beharko ditugu:

UMASK => 0027

Dagoeneko, konfigurazio prozesuak repositories izeneko direktorioa sortu du git erabiltzailearen home direktorioan. Bertan gorde eta kudeatu ahalko dira git errepositorio guztiak (administraziokoa barne).

Gitolite tresnak gitolite-admin errepositorioa erabiltzen du baimen kudeaketa egiteko. Hau da, errepositorio hori erabiltzen du konfigurazio fitxategi gisara. Bertan egindako push bakoitzeko, tresnak, egindako aldaketak irakurri eta beharrezko egokitzapenak egikarituko ditu.

Hurrengo pausua beraz, sortutako gako pribatua eta git bezero bat erabiliz administrazio errepositorioa gure makinan klonatzea da. Kontuan izan behar dugu, zerbitzarira konektatzen saiatzen hari garela arazorik suertzatzen bada, aurreko puntuak berrikusi beharko ditugula.

Errepositorioa deskargatuta bi direktorio aurkitu ahalko ditugu bertan:

  • conf: Gitoliteren konfigurazio fitxategia gordetzeko balio duena.
  • keydir: Erabiltzaileen gakoak gordetzeko balio duen direktorioa (administratzailearen gakoa dagoeneko bertan aurkituko duzu).

conf direktorioan aurkitzen den gitolite.conf fitxategia erabiliko dugu administrazio fitxategi gisara. Bertan egindako aldaketen push bat eginda automatikoki sortuko dira detektatutako erabiltzaile eta errepositorio berriak (erabiltzaile berrien gako publikoak keydir direktorioan gorde beharko dira izen berdineko fitxategietan).

Gitweb arakatzailea instalatu

Azken pausua gure zerbitzariari git errepositorioen web arakatzailea gehitzea da. Horretarako gitweb eta bere pakete laguntzaileak instalatu beharko ditugu.

1
sudo apt-get install highlight gitweb

Ondoren, arakatzailearen konfigurazioa editatuko ditugu errepositorioen kokalekua eta bestelako datuak zehazteko. Horretarako /etc/gitweb.conf fitxategia ireki eta honako sarrerak editatu behar dira:

$projectroot = "/home/git/repositories";
$projects_list = "/home/git/projects.list";
#Azken lerro hau gehitu
$feature{'highlight'}{'default'} = [1];

gitweb tresnari errepositorietara atzipena baimentzeko honako komandoak erabiliko ditugu

1
2
3
4
sudo usermod -a -G git www-data
sudo chmod g+r /home/git/projects.list
sudo chmod -R g+rx /home/git/repositories
sudo service apache2 restart

Azken pausoa test errepositorioa web arakatzailean publiko egitea da. Horretarako honako aldaketak egingo dizkiogu gitolite.conf fitxategiari (aldaketak indarrean jartzeko, etzazu ahaztu errepositorioaren commit eta push-a egitea).

repo testing
  RW+ = @all
  R = gitweb

Arakatzailea zuzen konfiguratu dela baieztatzeko zure nabigadorean http://[zure-domeinua]/gitweb helbidera atzitzea besterik ez zaigu falta.

WebSVN Errepositorio Arakatzailea

WebSVN internet bidez Subversion errepositorioak arakatzeko tresna da. Oso erabilgarria suerta daiteke garatutako kodeak modu profesionalean plazaratzeko.

Atzitzaile hau Apache web zerbitzariaren dav_svn moduluaren laguntzaz, urruneko errepositorioak atzitzeko gai da. Hona hemen sistema martxan jarri ahal izateko jarraitu beharreko pausuak.

  1. Lehenik dav_svn modulua instalatu beharra dago
    sudo apt-get install subversion libapache2-svn
  2. Apache zerbitzarian modulua aktibatu
    sudo a2enmod dav_svn
  3. Apache zerbitzarian vhost berri bat sortu eta honako kodea atxikitu. Ikus daitekeen moduan SVNListParentPath eta AuthzSVNAccessFile parametroak errepositorioaren instalazioarekin erlazio zuzena dute.
    <VirtualHost *:80>
            ServerName svn.domeinuaren.izena
     
            ServerSignature On
            LogLevel warn
            ErrorLog /var/log/apache2/error.log
            CustomLog /var/log/apache2/access.log combined
     
            <Location />
                    DAV svn
                    SVNParentPath /errepositorioen/erro/direktorioa
                    SVNListParentPath off
                    SVNPathAuthz off
                    AuthzSVNAccessFile /errpositorioen/erabiltzaile/fitxategia/authz
            </Location>
    </VirtualHost>
  4. Azkenik Apache zerbitzaria berhabiaratu eta dagoeneko Subversion errepositoriorako sarrera izango duzu svn.domeinua.izena helbidean.
  5. Kontuan izan beharra dago errepositorioaren authz fitxategia modu egokian konfiguratu beharra dagoela. Bestela, internet bidez edonork errepositorioan aldaketa sortzeko aukera izatea gerta liteke.
  6. Behin dav_svn modulua eta kanpo konexioa konfiguratuta, WebSVN instalatzea da hurrengo pausoa. Lehenik azken bertsioa jaitsi beharra dago honako helbidetik http://websvn.tigris.org/servlets/ProjectDocumentList
  7. Ondoren gustoko direktorio batean deskonprimitu eta Apache zerbitzarian vhost berri bat sortu beharra dago. Modu honetara WebSVN tresnaren web gunerako sarrera sortuz:
    <VirtualHost *:80>
            ServerName websvn.domeinuaren.izena
     
            ServerSignature On
            LogLevel warn
            ErrorLog /var/log/apache2/error.log
            CustomLog /var/log/apache2/access.log combined
     
            DocumentRoot /websvn/orrialdearen/direktorioa
     
            <Directory /websvn/orrialdearen/direktorioa>
                    AllowOverride None
                    Options -MultiViews -Indexes
                    Order allow,deny
                    Allow from all
            </Directory>
    </VirtualHost>
  8. Azkenik WebSVN orrialdea konfiguratzea besterik ez dago. Horretarako, instalazioak berak dakarren tutorial txikia jarraitu. Tutoriala honako helbidea atzituz lortu dezakezu http://websvn.oroitz.dyndns.org/doc/install.html.

Azken emaitza zein den ikusteko http://websvn.oroitz.dyndns.org orrialdean aurkitzen den nire WebSVN pertsonala bisita dezakezu.

ANT Fitxategiak

ANT Fitxategiak Javan, C lengoaian ezagunak diren Makefile-en pareko dira. XML datu errepresentazioan oinarritzen dira eta kodea konpilatu eta exekutagarriak sortzeko jaio ziren. Ala ere, gaur egun, Eclipse bezalako garapen tresnarekin konbinatuz, helburu anitzetarako erabilgarriak dira. Adibide honetan, web gune baten garapenean izan dezaketen erabileretako bat deskribatuko da.

Web garapenean JavaScript eta CSS tresnak erabiltzen direnean, ezin bestekoa da kode-fitxategien tamaina minimizatzea. Orrialdearen deskarga denbora nabarmen murrizten duen teknika honek ordea, pauso nekagarri ugari jarraitzera behartzen gaitu; fitxategiak banan banan minifikatzea alegia.

Beraz lana automatizatzeko ANT bezalako tresna batez baliatzea ezinbestekoa suertatzen da. Minimizazio prozesurako YUI Compresor tresna erabili da. Behin konpresorea gure sisteman instalatuta, honako ANT fitxategia sortzea besterik ez dago:

<?xml version=”1.0″ encoding=”UTF-8″?>
<project name=”Build” default=”build” basedir=”.”>
<property name=”compressor” location=”C:/Program Files (x86)/YUICompressor/yuicompressor.jar”/>

<target name=”build”>
<property name=”js_src_folder” value=”js/”/>
<property name=”js_dst_folder” value=”js/min/”/>
<property name=”js_dst_file” value=”jquery.all.min.js”/>
<property name=”css_src_folder” value=”css/”/>
<!– Process JavaScript –>
<delete>
<fileset dir=”${js_src_folder}” includes=”*.min.js”/>
</delete>

<exec executable=”java” >
<arg value=”-jar”/>
<arg value=”${compressor}”/>
<arg value=”-o”/>
<arg value=”.js$:.min.js”/>
<arg value=”${js_src_folder}*.js”/>
</exec>
<copy todir=”${js_dst_folder}” overwrite=”true”>
<fileset dir=”${js_src_folder}” includes=”*.min.js”/>
</copy>

<delete>
<fileset dir=”${js_src_folder}” includes=”*.min.js”/>
</delete>
<!– –>

<!– Process CSS –>
<delete>
<fileset dir=”${css_src_folder}” includes=”*.min.css”/>
</delete>

<exec executable=”java” >
<arg value=”-jar”/>
<arg value=”${compressor}”/>
<arg value=”-o”/>
<arg value=”.css$:.min.css”/>
<arg value=”${css_src_folder}*.css”/>
</exec>
<!– –>
</target>
</project>

Fitxategia erabiltzailearen beharretara moldatu dadin, honako baloreak aldatu beharko dira:

  • <property name=”compressor” location=”C:/kokalekua/yuicompressor.jar“/>
  • <property name=”js_src_folder” value=”js/fitxategien/kokaleku/erlatiboa/“/>
  • <property name=”js_dst_folder” value=”js/fitxategien/helburu/erlatiboa/“/>
  • <property name=”css_src_folder” value=”css/fitxategi/kokaleku/erlatiboa/“/>

Oso garrantzitsua da helbide erlatiboak, fitxategiaren hasieran agertzen den <project name=”Build” default=”build” basedir=”.”> propietatearekin batera egoki konfiguratzea.

Moldaketa horiek egin ondoren, fitxategia gorde (Adibidez build.xml izenez) eta Eclipseko proiektuaren erro direktorioan kopiatu. Fitxategia exekutatu nahi izanez gero, ANT fitxategik modura exekutatu beharko da:

ANT Exekuzioa

ANT Exekuzioa

Sortze prozesua amaitzen denean, emaitza bezala, proiektuan aurkitzen diren JavaScript eta CSS fitxategiak automatikoki minimizatuak izango dira.

Esteka interesgarriak:

Facebook-eko Share-a Ajax Web Orrialde Batean

Facebook sare sozialak norberaren horman edukiak argitaratzeko aukera eskaintzen du, horretarako share botoiaz baliatzen delarik.

Web orrialde estatikoetan, share botoiaren txertaketa erraza eta sinplea da. Ajax teknologian oinarritzen diren web orrialdeetan ordea, arazo mordoa agertu daiteke. Share botoia, orrialdearen  “head” atalean aurkitzen diren metadatetan oinarritzen da edukia identifikatu ahal izateko. Ajax-en oinarrituriko orrialdeek ordea, eduki desberdin guztiek buruko (head) berbera konpartitzen dute.

Arazo hau ekiditeko hauek dira jarraitu beharreko pausuak:

  • Lehenik eta behin share botoiaren kodea txertatuko beharra dago. (www.example.com helbidea adibide gisara erabiliko da)
<script src="http://static.ak.fbcdn.net/connect.php/js/FB.Share" type="text/javascript"></script>
<a name="fb_share" class="facebook_share" share_url="http://www.example.com"></a>
  • Ondoren meta txertaketarako zubi gisara lan egingo duen php kodea idatziko da. Horretarako fbshare.php izeneko fitxategia sortu eta onako kodea txertatu behar zaio.
<?php
	$index = 'index.html';
 
	if (file_exists($index)) {
		$index_content = file_get_contents($index);
 
		$fbmeta = 	"<meta property='og:title' content='" . $_GET['title'] . "' />" .
				"<meta property='og:type' content='blog' />" .
				"<meta property='og:url' content='http://www.example.com' />" .
				"<meta property='og:image' content='http://" . $_GET['image'] . "' />" .
				"<meta property='og:site_name' content='Example Web' />";
 
		$html_content = str_replace("</head>", $fbmeta . "</head>", $index_content);
		echo $html_content;
	}
?>

PHP kode honek, web orrialdearen index.html fitxategia hartu eta “head” atalean behar diren meten txertaketa egiten du. Kontuan izan aurreko kodeko $_GET  parametroak ondorengo puntuan landuko den URL-aren araberakoak direla.

  • Azkenik share botoian ezarriko den “share_url” atributuaren balioa sortu beharra dago. Ikusi daitekeen moduan, php kodean meten baliotzat ezartzen diren balioak, url-an bidalitako parametroak dira. Beraz gure url-ak honelako itxura izan beharko du:
http://www.example.com/fbshare.php?title=[gure_titulua]&amp;image=[gure_preview_irudirako_URLa]

Pausu hauek jarraitu ondoren, erabiltzaile arruntek index.html fitxategia erabiltzen jarraitu ahal izango dute orrialdea bisitatzeko, share eskaerak ordea, fbshare.php fitxategitik bideratuko direlarik.

Esteka interesgarriak:

Share botoiaren txertaketarako dokumentazioa:
http://www.facebook.com/share_partners.php
Adibidea:
http://www.oroitz.dyndns.org/?lang=eu&content=dev

JQuery Plugin-ak Eraikitzen

JQuery liburutegiaren gainean plugin-ak eratzeko balio duten txantiloi ugari aurki daiteke interneten zehar. Ala ere, guztietan arazo berdinarekin aurkitu nahiz: pluginek aldagaien instantzia bakarra onartzen dute, hots, plugin instantzia guztiek aldagai global berberak erabili behar dituzte.

Hori ekiditeko hona hemen instantzietan aldagai propioak eraikiz plugin bat sortzeko balio duen txantiloila:

Lehenik eta behin, JavaScript klase arrunta sortu beharra da:

function JQueryClass(_options) {
	this.options = _options;
};
 
JQueryClass.prototype.getValue = function() {
	return this.options.value;
};

Ondoren klase horren instantziak sortuko dituen JQuery plugin-a eraiki:

(function($) {
	var defaultOptions = {
		value:0
	},
	instance_key = 'jqueryclass_key';
 
	$.fn.jqueryclass = function(_options) {
		var instance = this.data(instance_key);
 
		if(instance == undefined) {
			instance = new JQueryClass($.extend({}, defaultOptions, _options));
			this.data(instance_key, instance);
		}
 
		return instance;
	};
 
})(jQuery);

Eraikitako plugin-a testeatzeko honako kodea erabili daiteke. Emaitza bezala plugin instantzia bakoitzak bere “value” balio propioa pantailaratuko du. Kontuan izan kode hau ez dagoela guztiz osatua (ikus azpko index.html esteka test kode osoa ikusteko).

$(document).ready(function()
{
	$('#container_default').jqueryclass({
	});
 
	$('#container_1').jqueryclass({
		value:1
	});
 
	$('#container_2').jqueryclass({
		value:2
	});
 
	alert("jqueryclass instance 0 value: " + $('#container_default').jqueryclass().getValue());
	alert("jqueryclass instance 1 value: " + $('#container_1').jqueryclass().getValue());
	alert("jqueryclass instance 2 value: " + $('#container_2').jqueryclass().getValue());
});

Erabilitako kode osoa eta testerako index fitxategia  honako esteketan lor daitezke:

index.html (Test Fitxategia)
jqueryclass.js (JQuery plugin-aren txantiloila)