Web aplikacija za evidentiranje integrirane poljoprivredne

Web aplikacija za evidentiranje integriranepoljoprivredne djelatnosti

Ferenc, Goran

Undergraduate thesis / Završni rad

2019

Degree Grantor / Ustanova koja je dodijelila akademski / stručni stupanj: Polytechnic of Međimurje in Čakovec / Međimursko veleučilište u Čakovcu

Permanent link / Trajna poveznica: https://urn.nsk.hr/urn:nbn:hr:110:276242

Rights / Prava: In copyright

Download date / Datum preuzimanja: 2021-10-09

Repository / Repozitorij:

Polytechnic of Međimurje in Čakovec Repository - Polytechnic of Međimurje Undergraduate and Graduate Theses Repository

https://urn.nsk.hr/urn:nbn:hr:110:276242

http://rightsstatements.org/vocab/InC/1.0/

https://repozitorij.mev.hr



https://zir.nsk.hr/islandora/object/mev:1136

https://dabar.srce.hr/islandora/object/mev:1136

MEĐIMURSKO VELEUČILIŠTE U ČAKOVCU

STRUČNI STUDIJ RAČUNARSTVO

GORAN FERENC

WEB-APLIKACIJA ZA EVIDENTIRANJE INTEGRIRANE

POLJOPRIVREDNE DJELATNOSTI

ZAVRŠNI RAD

ČAKOVEC, 2019.

MEĐIMURSKO VELEUČILIŠTE U ČAKOVCU

STRUČNI STUDIJ RAČUNARSTVO

GORAN FERENC

WEB-APLIKACIJA ZA EVIDENTIRANJE INTEGRIRANE

POLJOPRIVREDNE DJELATNOSTI

WEB APPLICATION FOR RECORDING INTEGRATED

AGRICULTURAL ACTIVITIES

ZAVRŠNI RAD

Mentor:

dr. sc. Sanja Brekalo

ČAKOVEC, 2019.

ZAHVALA

Ovim putem želim zahvaliti svim profesorima Međimurskog veleučilišta u Čakovcu na

dobivenom znanju, prvenstveno mentorici dr. sc. Sanji Brekalo na pomoći, savjetima i

strpljenju prilikom izrade ovog rada.

Također zahvaljujem svim svojim kolegama i prijateljima koji su bili uz mene tijekom

studija.

Zahvaljujem svojoj obitelji koji su bili velika podrška tijekom trajanja studija i koji su mi

omogućili obrazovanje.

SAŽETAK

Web-aplikacija, u sklopu praktičnog dijela završnog rada, omogućuje

poljoprivrednicima evidentiranje integrirane poljoprivredne djelatnosti. Aplikacija nije

limitirana samo na integriranu proizvodnju, već se može koristiti za evidentiranje

djelatnosti i proizvodnih procesa u klasičnoj ili ekološkoj poljoprivredi. Namjena

aplikacije je lako, brzo i učinkovito evidentiranje raznih vrsta djelatnosti s kojima se

poljoprivrednici svakodnevno susreću.

Web-aplikacija za evidentiranje integrirane poljoprivredne djelatnosti razvijena je u

programskom jeziku PHP. Za pohranu podataka korištena je relacijska baza podataka

MySQL. Web-aplikacijom phpMyAdmin izrađena je cjelokupna baza podataka korištena

u projektu. Za korisničko sučelje koristile su se tehnologije HTML, CSS i Javascript

jezika, te Bootstrap i jQuery alati za brz i organiziran dizajn sučelja, kao i implementaciju

interaktivnih elemenata. Za razvojno okruženje odabran je Visual Studio Code uređivač

teksta. Za prikaz i interakciju aplikacije na računalu korišten je softverski paket WAMP.

Korisnici aplikacije podijeljeni su na dvije razine, obični korisnici i administratori.

Validacija novo registriranog korisničkog računa vrši se preko poveznice poslane

elektroničkom poštom na adresu računa. Aplikacija omogućuje resetiranje lozinke preko

navedene e-adrese i promjenu lozinke nakon prijave. Uz evidenciju gospodarstava,

zemljišta i raznih djelatnosti, aplikacija nudi i opciju generiranja PDF dokumenata

spremljenih podataka.

U pismenom dijelu rada opisane su tehnologije, alati i dodaci koji su korišteni u razvoju

web-aplikacije. Opisuje se struktura baze podataka kao i općenita podjela tablica ovisno

o njihovoj ulozi. Zadnji dio rada objašnjava princip rada i mogućnosti aplikacije s

priloženim slikama.

Ključne riječi: PHP, HTML, MySQL, Bootstrap, PDF, web-aplikacija, poljoprivreda,

evidencija

SADRŽAJ

1. UVOD ...................................................................................................................... 6

2. TEHNOLOGIJE ....................................................................................................... 8

2.1 HTML ................................................................................................................. 8

2.2 CSS ..................................................................................................................... 9

2.3 Javascript, jQuery i JSON.................................................................................... 9

2.4 Bootstrap i FontAwesome ................................................................................. 10

2.5 PHP ................................................................................................................... 11

2.6 MySQL ............................................................................................................. 11

2.7 PHPMailer ........................................................................................................ 12

2.8 DataTables ........................................................................................................ 13

2.9 TCPDF .............................................................................................................. 14

3. RAZVOJNO OKRUŽENJE .................................................................................... 15

3.1 Visual Studio Code............................................................................................ 15

3.2 WampServer ..................................................................................................... 16

3.3 phpMyAdmin .................................................................................................... 17

4. STRUKTURA BAZE PODATAKA ....................................................................... 18

4.1 Tablice korisnika ............................................................................................... 19

4.2 Tablica gospodarstva ......................................................................................... 19

4.3 Tablica zemljišta ............................................................................................... 19

4.4 Tablice djelatnosti ............................................................................................. 20

4.5 Tablica odredišne stranice ................................................................................. 20

5. WEB-APLIKACIJA EVIPOD ................................................................................. 21

5.1 Struktura web-aplikacije .................................................................................... 21

5.2 Odredišna stranica aplikacije ............................................................................. 22

5.3 Stranica za prijavu/registraciju .......................................................................... 23

5.4 Početna stranica ................................................................................................. 24

5.5 Stranica gospodarstva ........................................................................................ 25

5.6 Stranica zemljišta .............................................................................................. 26

5.7 Stranice sadnje/sjetve, plodoreda i berbe/žetve .................................................. 27

5.8 Stranica evidencija djelatnosti ........................................................................... 28

5.9 Stranica izvještaja .............................................................................................. 29

5.10 Stranica administratora .................................................................................... 31

6. ZAKLJUČAK ......................................................................................................... 32

7. POPIS LITERATURE ............................................................................................ 33

8. POPIS SLIKA ......................................................................................................... 34

Goran Ferenc Web-aplikacija za evidentiranje integrirane

poljoprivredne djelatnosti

Međimursko veleučilište u Čakovcu 6

1. UVOD

U današnje vrijeme, zbog naglog rasta broja stanovnika svijeta, raste i potreba za hranom.

Kako bi zadovoljili sve veću potražnju za kvalitetnom i zdravom hranom, proizvođači

hrane, primarno biljne proizvodnje, moraju u što kraćem vremenu na što manjoj površini

proizvesti što veću količinu proizvoda. Za uspješan rad moraju primjenjivati nove

tehnologije u mehanizaciji (traktori, kombajni, priključci, transporti…), kemijska

sredstva (herbicidi, fungicidi, insekticidi…), doškolovanje i poslovanje (računala, tableti

i pametni telefoni).

Jedan način poljoprivredne proizvodnje u moderno doba je konvencionalna ili klasična

poljoprivreda. Glavni cilj konvencionalne poljoprivredne proizvodnje je maksimiziranje

prinosa po jedinici poljoprivredne površine. Za ostvarenje tog cilja, konvencionalna

proizvodnja troši ogromne količine neobnovljivih prirodnih resursa i energije.

Onečišćenje i degradacija tla, vode i zraka posljedica je takve proizvodnje.

Radi poboljšanja odnosa čovjeka i prirode, nastala je ekološka poljoprivreda. Cilj

ekološke poljoprivrede je proizvodnja kvalitetnih proizvoda na način koji nije štetan za

okoliš i kojim se potiče očuvanje prirode. Zbog striktno reguliranih zakona ekološke

poljoprivredne proizvodnje, poljoprivrednici prolaze kroz složene i skupe proizvodne

procese te su time manje konkurentni. Iz navedenih razloga ekološka poljoprivreda nije

prihvaćena u onoj mjeri u kojoj je to bilo očekivano.

Umjesto sprečavanja kemijskih sredstava, integrirana poljoprivredna proizvodnja

minimizira i racionalizira upotrebu sredstava. Uz minimalnu upotrebu agrokemikalija i

uravnoteženu primjenu agrotehničkih mjera, integrirana proizvodnja nastoji proizvesti

ekološki i ekonomski prihvatljive proizvode. Integrirana proizvodnja predstavlja

izbalansirani odnos konvencionalne i ekološke poljoprivrede. Dozvoljavanjem upotrebe

kemijskih zaštitnih sredstava i mineralnih gnojiva (ograničeno i uz strogu kontrolu) čini

integriranu poljoprivredu konkurentnijom i manje rizičnom od ekološke poljoprivrede.

Naravno, zbog kontrole upotrebe kemijskih zaštitnih sredstava i mineralnih gnojiva treba

voditi evidenciju poljoprivrednih djelatnosti u integriranoj proizvodnji.




Početkom 2013. godine na snagu stupa Pravilnik o integriranoj proizvodnji

poljoprivrednih proizvoda [1]. U njemu su definirani uvjeti načina poljoprivredne

proizvodnje i evidentiranje proizvodnih postupaka. Svi proizvođači u integriranoj

poljoprivrednoj proizvodnji obavezni su voditi evidenciju o proizvodnji od početka

proizvodnje do prodaje proizvoda. Neki od podataka koje evidencija mora sadržavati su

ARKOD1 broj parcele, upotreba poljoprivrednog reprodukcijskog materijala, upotreba

gnojiva, primjena agrotehničkih mjera, upotreba sredstva za zaštitu bilja itd.

Svaki proizvođač dužan je cjelokupnu evidenciju čuvati najmanje pet godina. U manjih

proizvođača to nije toliki problem, dok se srednji i veliki proizvođači brzo nađu u gomili

papirologije. Budući da pravilnik daje slobodu u načinu dokumentiranja evidencije te

prepušta proizvođaču odabir vođenja evidencije u elektroničkom obliku ili/i na papiru,

naravno uz uvjet da sadrži sve propisane podatke, kreiranje digitalnog oblika

evidentiranja jedan je od koraka prema bržem i praktičnijem poslovanju proizvođača.

Digitalni oblik evidencije poljoprivredne djelatnosti stalno je dostupan. Budući da se radi

o web-aplikaciji, tehnički zahtjevi svedeni su na minimum te se zahtijeva samo pristup

internetu i ažurirani web-preglednik na uređaju na kojem se vrši evidencija, kao što je

stolno računalo, prijenosno računalo, tablet ili smartphone.

1 ARKOD – nacionalni sustav identifikacije zemljišnih parcela.




2. TEHNOLOGIJE

Prilikom razvoja web-aplikacija na raspolaganju su brojni alati kojima se mogu ostvariti

projekti. Web-aplikacije tipično se dijele na dvije osnovne razine – dio kȏda koji se

izvršava u web-pregledniku (engl. frontend ili client side) i dio koji se izvršava na serveru

(engl. backend ili server side). Za realizaciju sučelja s kojim krajnji korisnici dolaze u

kontakt odgovorni su frontend programeri, dok su za kȏd potreban za rad u pozadini, na

serverima, odgovorni backend programeri. Programeri odgovorni za obje razine,

realizaciju sučelja i kȏd na serveru, nazivaju se full stack programerima.

2.1 HTML

HTML (engl. HyperText Markup Language) osnovni je temelj interneta. HTML opisuje

i definira sadržaj internetske stranice i njezin raspored. Svoju rasprostranjenost duguje

jednostavnosti i tome što je otpočetka bio zamišljen kao besplatan i tako dostupan svima.

Zadaća je HTML-a uputiti internetski preglednik da uvijek jednako prikazuje hypertext

dokument, neovisno o vrsti internetskog preglednika, računala i operacijskog sustava.

HTML datoteke su zapravo tekstualne datoteke s ekstenzijama „.html“ ili „.htm“.

Osnovni elementi HTML stranice su oznake (engl. tags) koje opisuju kako će se nešto

prikazati u internetskom pregledniku [2].

Prvi javno dostupan opis HTML-a je dokument „HTML tags“, koji je prvi put spomenuo

Tim Berners-Lee krajem 1991. godine. Opis se sastoji od 18 elemenata početnog,

relativno jednostavnog dizajna HTML-a. 11 elemenata još uvijek postoji u HTML5.

Nakon što je napustio CERN2 1994. godine, Tim je osnovao organizaciju World Wide

Web Consortium koja se bavi standardizacijom tehnologija korištenih na internetu,

poznatija kao W3C [3].

2 CERN – Europsko vijeće za nuklearna istraživanja.




2.2 CSS

CSS (engl. Cascading Style Sheets) koristi se za definiranje izgleda HTML ili XML3

dokumenata. CSS je kao standard objavljen 1998. godine te omogućuje web-

programerima lakše odvajanje kȏda odgovornog za izgled dokumenta od strukture i

sadržaja [4].

2.3 Javascript, jQuery i JSON

Javascript je skriptni jezik koji je zajedno s HTML-om i CSS-om jedan od temeljnih

tehnologija internetskih stranica. Javascript omogućuje interakciju s internetskom

stranicom i promjenu njezinih elemenata bez potrebe ponovnog učitavanja kompletne

stranice sa servera. Za izvršavanje Javascript kȏda, web-preglednici koriste ugrađena

programska okruženja (engl. engine) kao V8 (Chrome, Opera) ili SpiderMonkey

(Firefox). Javascript se u početku koristio samo na frontendu web-preglednika, a danas

se može koristiti u drugim programskim rješenjima kao serverski program, u mobilnim i

računalnim aplikacijama te PDF programima [5].

Zbog velike popularnosti i lakše upotrebe Javascripta na internetskim stranicama, kreiran

je jQuery. Kao Javascript biblioteka (engl. library), jQuery olakšava selektiranje i

manipulaciju DOM (engl. Document Object Model) HTML dokumenta, rukovanje

događanjima (engl. events), animacije i AJAX (engl. Asynchronous JavaScript And

XML). jQuery pretvara uobičajene Javascript zadatke pisane u nekoliko linija u metode

koje se pozivaju jednom linijom kȏda. Glavni je slogan jQuery biblioteke „piši manje,

učini više“ (engl. write less, do more) [6].

JSON (engl. JavaScript Object Notation) format je podataka otvorenog standarda koji

koristi tekst za prijenos podataka. Podatak se sastoji od ključa i vrijednosti (engl. key-

value pair). JSON format podataka upotrebljava se u asinkronoj komunikaciji između

web-preglednika i servera. Prvi put spomenut kao podskup Javascript programskog

jezika, JSON format je standardiziran 2013. godine i danas je neovisan o programskom

jeziku, te puno modernih programskih jezika sadrži kȏd za generiranje i raščlanjivanje

podataka u JSON formatu [7].

3 XML – prezentacijski jezik (engl. eXtensible Markup Language).




2.4 Bootstrap i FontAwesome

Bootstrap je besplatan alat (engl. framework) otvorenog kȏda namijenjen za razvoj

sučelja web-aplikacija prilagodljivog dizajna, primarno namijenjen mobilnim uređajima

(engl. responsive mobile-first). Koristeći alate CSS, Javascript i jQuery biblioteke,

Bootstrap nudi već unaprijed dizajnirane predloške za HTML elemente, forme, gumbe,

navigacijske trake, kao i dodatne Javascript ekstenzije za validaciju polja za unos

podataka, prikaz dinamičkih prozora i sl. Najpopularnija komponenta Bootstrap alata je

njegov sustav rešetaka (engl. grid system) prikazan na Slici 1. Koristeći seriju spremnika,

redaka i kolona za raspored i poravnavanje elemenata, sustav nudi prilagodljiv dizajn na

uređajima bilo koje veličine ekrana, do najviše 12 kolona [8].

Slika 1. Bootstrap grid sustav

Izvor: autor

FontAwesome je skup ikona i fontova baziranih na CSS i LESS4 tehnologijama. Dave

Gandy napravio je FontAwesome za korištenje u Bootstrapu, no poslije je prerađen u

zaseban paket. Trenutna verzija, FontAwesome 5, sastoji se od dva dijela, besplatne

verzije (engl. FontAwesome Free) i plaćene verzije (engl. FontAwesome Pro). Besplatna

verzija sadrži oko 1500 ikona, dok plaćena verzija ima oko 7000 ikona [9].

4 LESS – stilski jezik (engl. Leaner Style Sheets).




2.5 PHP

PHP (engl. Hypertext Preprocessor) programski je jezik otvorenog kȏda namijenjen

prvenstveno programiranju dinamičnih web-stranica. PHP kao besplatan programski

jezik ističe se podrškom raznih baza podataka i web-protokola (POP35, HTTP6), kao i

dostupnošću brojnih programskih biblioteka. Prednost PHP jezika je mogućnost

izvršavanja kȏda na svim web-serverima i operativnim sustavima.

Prvu verziju PHP-a započeo je Rasmus Lerdorf 1994. godine kao skup programa

napisanih u programskom jeziku C, za praćenje broja posjetitelja na njegovog osobnoj

stranici. Kasnije je inicijalna verzija proširena dodatnim mogućnostima, kao što su

baratanje formama i komunikacija s bazama podataka, nazvana PHP/FI (engl. Personal

Home Page/Forms Interpreter). Preradom većeg dijela kȏda i promjenom naziva u PHP,

godine 1998. izlazi PHP 3. Stjecanjem sve veće popularnosti zbog svog otvorenog

pristupa prilikom razvoja i lakoće razvijanja web-aplikacija, PHP se kontinuirano

poboljšavao te je trenutna verzija PHP 7.

U današnje vrijeme, zbog kompleksnosti i sigurnosti PHP aplikacija, programeri često

koriste neke od alata baziranih na PHP jeziku. Neki od poznatih PHP alata su Laravel,

CakePhp, Symfony, CodeIgniter i WordPress [10].

2.6 MySQL

MySQL je sustav za upravljanje bazom podataka otvorenog kȏda baziran na SQL jeziku.

Razvoj MySQL-a započeo je 1994. godine u švedskoj tvrtki MySQL AB i prva verzija

dostupna javnosti izašla je 1995. godine. Zato što je MySQL besplatan i otvorenog kȏda,

ovaj je sustav zajedno s PHP-om stekao veliku popularnost u projektima otvorenog kȏda.

MySQL baza relacijskog je tipa, stabilna, s dobro dokumentiranim modulima te ima

podršku brojnih programskih jezika.

MySQL baza sprema sve podatke unutar tablica koje se sastoje od kolona i redova.

Element koji se sprema u bazu naziva se entitetom. Kolone služe za spremanje pojedinih

podataka o nekom entitetu, a redovi sadrže sve podatke jednog entiteta. Za definiranje

određenih odnosa između entiteta koriste se relacije. Relacije mogu biti jedan prema

5 POP3 – standardni protokol za elektroničku poštu (engl. Post Office Protocol 3). 6 HTTP – komunikacijski protokol između servera i klijenta (engl. Hyper Text Transfer Protocol).




jedan, jedan prema više, više prema jedan i više prema više. Za identifikaciju relacija

koriste se primarni ključevi ili PK koji se u tablici mogu pojaviti samo jedanput. Izgled

cijele baze podataka naziva se shemom baze.

Za izradu, traženje, ažuriranje i brisanje podataka u MySQL bazama koristi se strukturni

upitni jezik SQL (engl. Structured Query Language). SQL je danas najpopularniji jezik

za manipulaciju relacijskih baza podataka i standardiziran je preko ANSI7 i ISO8

standarda [11].

2.7 PHPMailer

PHPMailer je PHP biblioteka za sigurno i jednostavno slanje elektroničke pošte preko

PHP kȏda. Koristeći objektno orijentiranu sintaksu, PHPMailer biblioteka omogućuje

brzo kreiranje jednostavne ili napredne elektroničke pošte pomoću velikog broja funkcija

ili već napravljenih predložaka.

PHP sadrži ugrađenu mail() funkciju, koja zahtijeva aktivan podsustav elektroničke pošte

na serveru. Dok većina poslužitelja nudi takve podsustave, ponekad ti podsustavi nisu u

potpunosti podesivi ili ih treba dodatno instalirati na lokalnom proizvodnom okruženju,

npr. Windows sustavi.

Za slanje jednostavne pošte s običnim tekstom dovoljna je mail() funkcija, no brzo postaje

ograničavajuća kada se radi o slanju priloga ili HTML elektroničke pošte. Neke su

prednosti PHPMailer biblioteke slanje priloga ili HTML pošte u jednoj liniji kȏda, laka

promjena između SMTP9 korisničkih računa, slanje elektroničke pošte bez lokalnog

podsustava, upotreba OAuth210 autentifikacije na Gmail računu itd. [12]

7 ANSI – Američki nacionalni institut za standarde. 8 ISO – Međunarodna organizacija za normizaciju. 9 SMPT – komunikacijski protokol za prijenos poruka elektroničke pošte. 10 OAuth2 – protokol za sigurno dijeljenje podataka između različitih aplikacija.




2.8 DataTables

DataTables dodatak je otvorenog kȏda za jQuery biblioteku. Upotrebom DataTables

dodatka, standardne HTML tablice dobivaju napredne opcije, a neke od njih prikazane su

na Slici 2. Izvor podataka koji će se koristiti u DataTables tablicama može biti DOM,

Javascript polje, AJAX upit ili rezultat sa servera [13].

Neke od naprednih mogućnosti:

• Paginacija

• Brzo pretraživanje i filtriranje

• Sortiranje višestrukih kolona

• Laka promjena izgleda

• Lokalizacija sučelja.

Slika 2. DataTables napredne opcije

Izvor: autor




2.9 TCPDF

TCPDF je PHP biblioteka otvorenog kȏda za generiranje PDF11 dokumenata. Jedna je od

najpopularnijih PHP PDF biblioteka, ponajviše zbog toga jer je uključena u velik broj

CMS12 aplikacija kao Drupal, phpMyAdmin i Symfony. Biblioteka podržava sve

standardne formate stranica, PDF bilješke, tablice sadržaja, automatsko numeriranje

stranica, upravljanje zaglavljem i podnožjem, enkripciju dokumenta itd. [14]

11 PDF – format zapisa dokumenata (engl. Portable Document Format). 12 CMS – sustav koji omogućuje upravljanje sadržajem (engl. Content management system).




3. RAZVOJNO OKRUŽENJE

Najčešće korišten alat u pisanju programskog kȏda je uređivač teksta. Pri izradi zadatka,

korišten je Visual Studio Code. Za pokretanje servera, baze podataka i web-aplikacije

korišten je WampServer paket. Za pristup i rad s bazom podataka korišten je

phpMyAdmin.

3.1 Visual Studio Code

Visual Studio Code je uređivač teksta ili tekstni editor otvorenog kȏda dizajniran i kreiran

za lakši rad u razvoju aplikacija, prikazan na Slici 3. Uređivač teksta razvija tvrtka

Microsoft s podrškom za Windows, Linux i macOS operativne sustave. Visual Studio

Code baziran je na Electron frameworku, alatu otvorenog kȏda korištenog za izradu

desktop aplikacija pomoću web-tehnologija.

Poznat pod kraticom VS Code, uređivač teksta sadrži brojne pomoćne alate za pisanje

kȏda [15].

Neki pomoćni alati su:

• Inteligentno dovršavanje kȏda (engl. intelligent code completion)

• Isticanje sintakse (engl. syntax highlighting)

• Podudaranje zagrada (engl. bracket matching)

• Ugrađeni i prilagođeni predlošci kȏda (engl. snippets)

• Ugrađena Git13 kontrola i GitHub

• Moguća promjena teme i prečaca za tipkovnicu

• Instalacija ekstenzija za dodatnu funkcionalnost.

13 Git – distribuirani sustav za upravljanje izvornim kȏdom.




Slika 3. Sučelje Visual Studio Code alata

Izvor: autor

3.2 WampServer

WampServer ili WAMP (engl. Windows, Apache, MySQL, PHP) skup je programskih

alata i razvojna okolina za Windows sustave. Instalacijom WampServer paketa dobivaju

se alati potrebni za razvoj web-aplikacija na lokalnom računalu [16].

Funkcionalnosti WampServer paketa su:

• Upravljanje Apache14 i MySQL servisom

• Pristup serveru lokalnim računalom ili unutar lokalne mreže

• Instalacija i promjena Apache, MySQL i PHP verzija

• Podešavanje serverskih postavki

• Pristup zapisniku (engl. log file)

• Pristup PHP postavkama.

14 Apache – besplatan web poslužitelj/server.




3.3 phpMyAdmin

phpMyAdmin je besplatna administracijska web-aplikacija otvorenog kȏda za

upravljanje MySQL i MariaDB bazama podataka preko web-preglednika (Slika 4).

Napisan je u PHP jeziku, te je jedan od najpopularnijih MySQL administracijskih alata.

phpMyAdmin omogućava izvršavanje MySQL operacija preko korisničkog sučelja, kao

što su kreiranje nove baze, dodavanje, izmjena i brisanje tablica, dodavanje novih

korisnika i izmjena dozvola pristupa istih, izvršavanje SQL upita itd. [17]

Slika 4. Sučelje phpMyAdmin aplikacije

Izvor: autor




4. STRUKTURA BAZE PODATAKA

Aplikacija koristi relacijski model povezivanja podataka između tablica. Baza je u

potpunosti napravljena pomoću phpMyAdmin alata. Sastoji se od 12 tablica koje se mogu

podijeliti u 5 kategorija ovisno o njihovoj ulozi: tablice korisnika, gospodarstva,

zemljišta, raznih djelatnosti i odredišne stranice (Slika 5).

Slika 5. Prikaz baze podataka

Izvor: autor




4.1 Tablice korisnika

Ove tablice sadrže podatke o registriranim korisnicima, razini pristupa (korisnik ili

administrator), validaciji korisničkog računa, aktivnom gospodarstvu i podatke o izmjeni

lozinke.

Tablice korisnika:

• users – sadrži podatke o korisnicima, njihovu ulogu, koristi se za validaciju

korisničkog računa i upis trenutno odabranog gospodarstva

• pwd_reset – sadrži podatke za izmjenu lozinke.

4.2 Tablica gospodarstva

U tablici gospodarstva nalaze se svi podaci koje korisnik navede prilikom dodavanja

novog gospodarstva.

Tablica gospodarstva:

• business – sadrži podatke o unesenim gospodarstvima korisnika, npr. ime

gospodarstva, OIB15, MIBPG16, adresa, informacije za kontakt.

4.3 Tablica zemljišta

Tablica zemljišta sadrži podatke o unesenim zemljištima koje korisnik obrađuje s

trenutno selektiranim gospodarstvom.

Tablica zemljišta:

• fields – sadrži podatke o unesenim zemljištima koje korisnik obrađuje ili ima u

posjedu te relevantne informacije kao ime zemljišta, veličina, ARKOD broj i sl.

15 OIB – osobni identifikacijski broj. 16 MIBPG – matični identifikacijski broj poljoprivrednog gospodarstva.




4.4 Tablice djelatnosti

Ove tablice sadrže podatke o djelatnostima koje je korisnik obavio na zemljištima.

Djelatnosti mogu biti sadnja/sjetva, zaštita, gnojidba, obrada tla, njega usjeva/nasada,

plodored i berba/žetva.

Tablice djelatnosti:

• planting – tablica sadrži podatke o sadnji ili sjetvi, zemljištu na kojem je djelatnost

obavljena, imenu kultivara, količini sadnog materijala, vremenu sadnje…

• protection – sadrži podatke o zaštiti zemljišnih kultura, nazivu sredstva za zaštitu,

nazivu štetnika protiv kojeg se provodi zaštita, vremenu i datumu zaštite, količini

utrošenih sredstava i kulturi na kojoj se vršila zaštita.

• fertilization – tablica odgovorna za spremanje podataka o gnojidbi zemljišta,

nazivu gnojiva, datumu i količini utrošenog gnojiva.

• tillage – tablica sadrži podatke o obradi tla zemljišta, vrsti obrade tla i datumu

obrade.

• care – tablica s podacima o njezi usjeva ili nasada, nazivu mjere ili zahvata, kulturi

na kojoj je odrađena njega i datumu.

• rotation – sadrži podatke o plodoredima zemljišta, godinu i kulturu koja je bila

aktivna na zemljištu.

• harvest – sprema podatke o berbi ili žetvi kulture na zemljištu, količinu i datum

berbe.

4.5 Tablica odredišne stranice

Tablica sadrži podatke koje može mijenjati i vidjeti samo administrator. U tablici su

upisani podaci koje aplikacija ispisuje na odredišnoj stranici (engl. landing page), prvoj

stranici kojom se novi korisnik susreće prilikom posjete.

Tablica odredišne stranice:

• landing_page – tablica sadrži brojne podatke o tekstu i ikonama koje će se

prikazivati na odredišnoj stranici. Neki od podataka su uvodni podnaslov, usluge

aplikacije i njihove FontAwesome ikone, kratki tekst usluga, adresa i informacije

za kontakt.




5. WEB-APLIKACIJA EVIPOD

Web-aplikacija za evidentiranje integriranje poljoprivredne djelatnosti (skraćeno

EVIPOD) omogućuje registriranim korisnicima praćenje poljoprivredne proizvodnje u

elektroničkom obliku u svrhu lakše i brže organizacije podataka. Registriranjem

korisničkog računa i validacije istog preko upisane e-adrese, korisnik dobiva mogućnost

prijave na aplikaciju. Nakon prijave otvara se početna stranica aplikacije na kojoj je

ispisan sažeti opis posljednjih djelatnosti, ako ih ima, te se nudi opcija za unos

gospodarstva. Prije unosa gospodarstva, poveznice na ostale stranice aplikacije (kao unos

zemljišta, djelatnosti ili ispisa PDF dokumenata) onemogućene su. Dodavanjem

gospodarstva, dobiva se mogućnost unosa zemljišta u aplikaciju. Unosom zemljišta koje

korisnik obrađuje, otvara se opcija za evidentiranje djelatnosti. Želi li korisnik evidenciju

ispisati na papir, aplikacija nudi opciju generiranja PDF dokumenta. Odabirom padajućeg

izbornika na navigacijskoj traci, korisnik može promijeniti svoju lozinku ili se odjaviti.

5.1 Struktura web-aplikacije

Aplikacija je podijeljena na 4 veće logičke cjeline, svaka cjelina s posebnim dizajnom

zbog lakšeg raspoznavanja u kojem dijelu aplikacije se korisnik nalazi.

Te cjeline su:

• Cjelina odredišne stranice

• Cjelina registracije, prijave i zaboravljene lozinke

• Cjelina aplikacije za praćenje djelatnosti

• Administratorska cjelina.




Struktura datoteka i mapa podijeljena je u 2 cjeline unutar mape same aplikacije. PHP

datoteke i mape odgovorne za odredišnu stranicu nalaze se u root mapi aplikacije, dok se

PHP datoteke i mape odgovorne za dijelove aplikacije (prijava, registracija, djelatnosti,

administratorski dio) nalaze u app mapi (Slika 6).

Slika 6. Struktura aplikacije

Izvor: autor

5.2 Odredišna stranica aplikacije

Odredišna stranica (engl. landing page) prva je stranica s kojom se korisnik susreće (Slika

7). Podijeljena je u 3 interaktivna dijela; kratak opis aplikacije, usluge koje aplikacija nudi

i informacije za kontakt. Osim glavnog naslova aplikacije, navigacijske trake,

pozadinskih slika i teme, ostali sadržaj administrator može mijenjati u administratorskom

dijelu aplikacije.




Slika 7. Odredišna stranica

Izvor: autor

5.3 Stranica za prijavu/registraciju

Klikom gumba „Prijava/Registracija“ na odredišnoj stranici, korisnik dolazi do stranice

za prijavu ili registraciju (Slika 8). Odabirom kartice, korisnik mijenja vidljivost sadržaja

između dijela za prijavu i dijela za registraciju bez ponovnog učitavanja stranice. Odabere

li korisnik opciju za registriranje, nakon unosa podataka na e-adresu korisnika dolazi

poveznica kojom aktivira korisnički račun i nakon toga se može prijaviti u aplikaciju. Na

stranici se još nalazi poveznica za mijenjanje lozinke na kojoj korisnik unosi svoju e-

adresu te na nju dobiva poveznicu na stranicu s formom za izmjenu lozinke. Valjanost

poveznice u e-pošti ograničena je na 15 minuta.




Slika 8. Stranica za prijavu/registraciju

Izvor: autor

5.4 Početna stranica

Prijavom u aplikaciju prikazuje se početna stranica, vidljiva na Slici 9. Nakon prijave i

ulaska u aplikaciju, tema, izgled stranica i raspored elemenata mijenjaju se te su

standardizirani u cijeloj aplikaciji. Na vrhu stranice nalazi se navigacijska traka s

padajućim izbornikom koji sadrži poveznice za mijenjanje lozinke i odjavu te, ako je

prijavljen administrator, poveznicu za administratorske postavke. Na lijevoj strani

stranice nalazi se izbornik s poveznicama za ostale dijelove aplikacije. Najveći dio

stranice zauzima odjeljak u kojem se nalazi popis nedavnih djelatnosti. Ako korisnik još

nije dodao gospodarstvo, poveznice s izbornika na lijevoj strani su onemogućene.




Slika 9. Početna stranica aplikacije

Izvor: autor

5.5 Stranica gospodarstva

Odabirom poveznice „Gospodarstvo“ korisnik dolazi na stranicu koja sadrži listu

unesenih gospodarstava, te opciju za dodavanje gospodarstva. Unesena gospodarstva

ispisana su u tablici s najvažnijim podacima. Klikom na ime gospodarstva otvara se

prozor s detaljima. S desne strane tablice nalaze se poveznice za uređivanje i brisanje

gospodarstva (Slika 10).

Slika 10. Stranica gospodarstva

Izvor: autor




Klikom na opciju „Dodaj gospodarstvo“, korisniku se otvara forma za dodavanje

gospodarstva prikazana na Slici 11. Unosom gospodarstva, korisnik dobiva mogućnost

odabira prethodno onemogućenih poveznica na lijevome izborniku. U navigacijskoj traci

pojavljuje se gumb za izbor trenutno aktivnog gospodarstva. Korisnik može dodati više

gospodarstava i voditi zasebnu evidenciju.

Slika 11. Forma za dodavanje gospodarstva

Izvor: autor

5.6 Stranica zemljišta

Isto kao i na stranici gospodarstva, odabirom poveznice „Zemljišta“ korisnik dolazi na

stranicu s ispisom svih unesenih zemljišta i opcija za dodavanje zemljišta (Slika 12).

Dodavanjem zemljišta, korisnik dobiva mogućnost evidentiranja djelatnosti koje su se

izvršavale na tom zemljištu. Ako korisnik nije dodao nijedno zemljište, pristup

stranicama za evidentiranje djelatnosti je omogućen, ali dodavanje evidencija nije

moguće. Brisanjem zemljišta automatski se brišu sve djelatnosti koje su vezane za

obrisano zemljište. Klikom na znak pokraj ARKOD broja zemljišta, ako je naveden,

otvara se nova stranica s lokacijom zemljišta preko aplikacije ARKOD.




Slika 12. Stranica zemljišta

Izvor: autor

5.7 Stranice sadnje/sjetve, plodoreda i berbe/žetve

Stranice sadnje/sjetve, plodoreda i berbe/žetve koriste sličan raspored elemenata kao

stranica zemljišta. Odabirom bilo koje od ovih triju stranica, korisniku je prvo ispisana

interaktivna tablica u kojoj može pretraživati djelatnosti koje je odradio, promijeniti

poredak podataka ili prelistavati stranice tablice ako je broj redaka dovoljno velik. S desne

strane tablice nalaze se poveznice za uređivanje ili brisanje pojedine djelatnosti.

Odabirom kartice za dodavanje otvara se forma gdje se korisniku nude zemljišta koja je

uveo, te odabirom zemljišta dodaje djelatnost i prateće podatke.




5.8 Stranica evidencija djelatnosti

Stranica evidencija djelatnosti podijeljena je na 4 dijela. Prilikom korištenja aplikacije,

korisnik provodi većinu vremena na ovoj stranici (Slika 13).

Dijelovi stranice:

• Zaštita

• Gnojidba

• Obrada tla

• Njega usjeva/nasada.

Slika 13. Evidencija djelatnosti

Izvor: autor

Korisnik može mijenjati dijelove stranice klikom na traku s ponuđenim karticama za

određenu djelatnost. Klikom na karticu, aplikacija prikazuje interaktivnu tablicu s

uvedenim djelatnostima te poveznice za izmjenu i brisanje. U desnome gornjem kutu

nalazi se gumb za dodavanje odabrane djelatnosti. Gumb otvara prozor s formom preko

koje korisnik dodaje nove djelatnosti, prikazan na Slici 14.




Slika 14. Prozor za dodavanje djelatnosti

Izvor: autor

5.9 Stranica izvještaja

Klikom na poveznicu „Izvještaji“, korisnik dolazi na stranicu s vidljivom tablicom svih

kategorija stranice (zemljišta i razne djelatnosti). U srednjem stupcu tabele ispisan je broj

koji označava koliko redaka svaka kategorija ima. U desnom stupcu nalaze se gumbi za

svaku kategoriju kojim korisnik generira PDF dokument. Klikom na gumb otvara se

prozor za spremanje datoteke PDF dokumenta s unaprijed generiranim imenom,

prikazano na Slici 15.




Slika 15. Stranica izvještaja i prozor za spremanje

Izvor: autor

Generirani PDF dokument prikazuje sva zemljišta ili djelatnosti trenutno aktivnog

gospodarstva u tablici jednostavnog izgleda, prikazano na Slici 16.

Slika 16. Primjer generiranog PDF dokumenta

Izvor: autor




5.10 Stranica administratora

Ako je korisnik prijavljen kao administrator, u padajućem izborniku na navigacijskoj traci

vidljiva je poveznica za administratorski dio. Na početnoj stranici administratorskog

dijela ispisana je tablica sa svim korisnicima koji su registrirali račun na aplikaciji. Pokraj

svakog korisnika ponuđene su opcije u obliku gumba za brisanje korisnika, blokiranje

pristupa korisniku (engl. ban) te, ako je korisnik već bio blokiran, ponovni pristup

aplikaciji (Slika 17). Klikom na karticu „Postavke odredišne stranice“ administrator

dolazi na dio stranice odgovoran za promjenu sadržaja odredišne stranice. Ponuđenom

formom administrator može mijenjati tekstove, ikone i informacije za kontakt triju sekcija

na odredišnoj stranici. Pozadinske slike, temu i glavni naslon nije moguće promijeniti.

Slika 17. Stranica administratora

Izvor: autor




6. ZAKLJUČAK

Današnji poljoprivrednici svakodnevno dolaze u kontakt sa zakonodavnim regulacijama,

a naročito u segmentu dokumentiranja proizvodnih procesa i poljoprivrednih djelatnosti.

Cilj tih regulacija je standardizirana kvaliteta proizvoda i zaštita zdravlja konzumenata.

Posljedica je dodatan posao za poljoprivrednike u smislu evidencije djelatnosti, praćenja

novih zakona i čuvanja dokumenata nastalih tijekom godina.

Upotrebom modernih tehnologija za razvoj web-aplikacija kao što su HTML, CSS, PHP,

MySQL i Javascript, poljoprivrednicima se nudi rješenje u digitalnom obliku koje je

centralizirano, svi podaci su na jednome mjestu, uvijek dostupni korištenjem modernih

uređaja kao što su pametni telefoni, računala i tableti. Aplikacija je proširiva dodatnim

opcijama ako dođe do promjene zakona i regulacija.

Poljoprivrednici kao korisnici aplikacije mogu bez čekanja pohraniti svoje djelatnosti u

trenutku kada ih završe, evidencije mogu pregledavati, izmjenjivati i obrisati u nekoliko

koraka te ispisati potrebne podatke na papir. Administratori mogu kontrolirati pristup

korisnika aplikaciji i mijenjati sadržaj određenih elemenata aplikacije.




7. POPIS LITERATURE

[1] Pravilnik o integriranoj proizvodnji poljoprivrednih proizvoda (NN 137/2012).

[2] What is HTML?, https://www.yourhtmlsource.com/starthere/whatishtml.html, 31.

kolovoza 2019.

[3] A history of HTML, https://www.w3.org/People/Raggett/book4/ch02.html, 31.

kolovoza 2019.

[4] CSS: Cascading Style Sheets, https://developer.mozilla.org/en-US/docs/Web/CSS,

31. kolovoza 2019.

[5] An Introduction to JavaScript, https://javascript.info/intro, 31. kolovoza 2019.

[6] jQuery Introduction, https://www.w3schools.com/jquery/jquery_intro.asp, 31.

kolovoza 2019.

[7] JSON, https://www.copterlabs.com/json-what-it-is-how-it-works-how-to-use-it/, 31.

kolovoza 2019.

[8] Bootstrap, https://getbootstrap.com/, 2. rujna 2019.

[9] FontAwesome, https://fontawesome.com/how-to-use/on-the-web/referencing-

icons/basic-use, 2. rujna 2019.

[10] Što je PHP?, http://www.netakademija.hr/sto-je-php/, 3. rujna 2019.

[11] MySQL Tutorial, https://www.tutorialspoint.com/mysql/index.htm, 3. rujna 2019.

[12] PHPMailer complete tutorial, https://alexwebdevelop.com/phpmailer-tutorial/, 4.

rujna 2019.

[13] DataTables, https://datatables.net/, 4. rujna 2019.

[14] TCPDF, https://github.com/tecnickcom/TCPDF, 4. rujna 2019.

[15] Visual Studio Code FAQ, https://code.visualstudio.com/docs/supporting/faq, 6.

rujna 2019.

[16] WampServer, http://www.wampserver.com/en/, 6. rujna 2019.

[17] phpMyAdmin, https://www.phpmyadmin.net/, 6. rujna 2019.




8. POPIS SLIKA

Slika 1. Bootstrap grid sustav. Izvor: autor .................................................................. 10

Slika 2. DataTables napredne opcije. Izvor: autor ........................................................ 13

Slika 3. Sučelje Visual Studio Code alata. Izvor: autor ................................................ 16

Slika 4. Sučelje phpMyAdmin aplikacije. Izvor: autor ................................................. 17

Slika 5. Prikaz baze podataka. Izvor: autor .................................................................. 18

Slika 6. Struktura aplikacije. Izvor: autor .................................................................... 22

Slika 7. Odredišna stranica. Izvor: autor ...................................................................... 23

Slika 8. Stranica za prijavu/registraciju. Izvor: autor ................................................... 24

Slika 9. Početna stranica aplikacije. Izvor: autor .......................................................... 25

Slika 10. Stranica gospodarstva. Izvor: autor ............................................................... 25

Slika 11. Forma za dodavanje gospodarstva. Izvor: autor ............................................ 26

Slika 12. Stranica zemljišta. Izvor: autor ..................................................................... 27

Slika 13. Evidencija djelatnosti. Izvor: autor ............................................................... 28

Slika 14. Prozor za dodavanje djelatnosti. Izvor: autor ................................................ 29

Slika 15. Stranica izvještaja i prozor za spremanje. Izvor: autor .................................. 30

Slika 16. Primjer generiranog PDF dokumenta. Izvor: autor ........................................ 30

Slika 17. Stranica administratora. Izvor: autor ............................................................. 31

Documents

Web aplikacija za evidentiranje integrirane poljoprivredne