-
-
Notifications
You must be signed in to change notification settings - Fork 1
/
Copy pathindex.html
983 lines (983 loc) · 113 KB
/
index.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
323
324
325
326
327
328
329
330
331
332
333
334
335
336
337
338
339
340
341
342
343
344
345
346
347
348
349
350
351
352
353
354
355
356
357
358
359
360
361
362
363
364
365
366
367
368
369
370
371
372
373
374
375
376
377
378
379
380
381
382
383
384
385
386
387
388
389
390
391
392
393
394
395
396
397
398
399
400
401
402
403
404
405
406
407
408
409
410
411
412
413
414
415
416
417
418
419
420
421
422
423
424
425
426
427
428
429
430
431
432
433
434
435
436
437
438
439
440
441
442
443
444
445
446
447
448
449
450
451
452
453
454
455
456
457
458
459
460
461
462
463
464
465
466
467
468
469
470
471
472
473
474
475
476
477
478
479
480
481
482
483
484
485
486
487
488
489
490
491
492
493
494
495
496
497
498
499
500
501
502
503
504
505
506
507
508
509
510
511
512
513
514
515
516
517
518
519
520
521
522
523
524
525
526
527
528
529
530
531
532
533
534
535
536
537
538
539
540
541
542
543
544
545
546
547
548
549
550
551
552
553
554
555
556
557
558
559
560
561
562
563
564
565
566
567
568
569
570
571
572
573
574
575
576
577
578
579
580
581
582
583
584
585
586
587
588
589
590
591
592
593
594
595
596
597
598
599
600
601
602
603
604
605
606
607
608
609
610
611
612
613
614
615
616
617
618
619
620
621
622
623
624
625
626
627
628
629
630
631
632
633
634
635
636
637
638
639
640
641
642
643
644
645
646
647
648
649
650
651
652
653
654
655
656
657
658
659
660
661
662
663
664
665
666
667
668
669
670
671
672
673
674
675
676
677
678
679
680
681
682
683
684
685
686
687
688
689
690
691
692
693
694
695
696
697
698
699
700
701
702
703
704
705
706
707
708
709
710
711
712
713
714
715
716
717
718
719
720
721
722
723
724
725
726
727
728
729
730
731
732
733
734
735
736
737
738
739
740
741
742
743
744
745
746
747
748
749
750
751
752
753
754
755
756
757
758
759
760
761
762
763
764
765
766
767
768
769
770
771
772
773
774
775
776
777
778
779
780
781
782
783
784
785
786
787
788
789
790
791
792
793
794
795
796
797
798
799
800
801
802
803
804
805
806
807
808
809
810
811
812
813
814
815
816
817
818
819
820
821
822
823
824
825
826
827
828
829
830
831
832
833
834
835
836
837
838
839
840
841
842
843
844
845
846
847
848
849
850
851
852
853
854
855
856
857
858
859
860
861
862
863
864
865
866
867
868
869
870
871
872
873
874
875
876
877
878
879
880
881
882
883
884
885
886
887
888
889
890
891
892
893
894
895
896
897
898
899
900
901
902
903
904
905
906
907
908
909
910
911
912
913
914
915
916
917
918
919
920
921
922
923
924
925
926
927
928
929
930
931
932
933
934
935
936
937
938
939
940
941
942
943
944
945
946
947
948
949
950
951
952
953
954
955
956
957
958
959
960
961
962
963
964
965
966
967
968
969
970
971
972
973
974
975
976
977
978
979
980
981
982
983
<html>
<head><meta http-equiv=Content-Type content="text/html; charset=UTF-8">
<link rel="icon" href="https://mbtskoudsalg.com/images/book-png-8.png">
<style type="text/css">
<!--
span.cls_002{font-family:Arial,serif;font-size:11.1px;color:rgb(0,0,0);font-weight:normal;font-style:normal;text-decoration: none}
div.cls_002{font-family:Arial,serif;font-size:11.1px;color:rgb(0,0,0);font-weight:normal;font-style:normal;text-decoration: none}
span.cls_003{font-family:Arial,serif;font-size:26.1px;color:rgb(0,0,0);font-weight:normal;font-style:normal;text-decoration: none}
div.cls_003{font-family:Arial,serif;font-size:26.1px;color:rgb(0,0,0);font-weight:normal;font-style:normal;text-decoration: none}
span.cls_005{font-family:Arial,serif;font-size:14.1px;color:rgb(0,0,0);font-weight:bold;font-style:normal;text-decoration: none}
div.cls_005{font-family:Arial,serif;font-size:14.1px;color:rgb(0,0,0);font-weight:bold;font-style:normal;text-decoration: none}
span.cls_006{font-family:Arial,serif;font-size:11.1px;color:rgb(0,0,0);font-weight:bold;font-style:normal;text-decoration: none}
div.cls_006{font-family:Arial,serif;font-size:11.1px;color:rgb(0,0,0);font-weight:bold;font-style:normal;text-decoration: none}
span.cls_007{font-family:Arial,serif;font-size:20.1px;color:rgb(0,0,0);font-weight:normal;font-style:normal;text-decoration: none}
div.cls_007{font-family:Arial,serif;font-size:20.1px;color:rgb(0,0,0);font-weight:normal;font-style:normal;text-decoration: none}
span.cls_004{font-family:Arial,serif;font-size:16.1px;color:rgb(0,0,0);font-weight:normal;font-style:normal;text-decoration: none}
div.cls_004{font-family:Arial,serif;font-size:16.1px;color:rgb(0,0,0);font-weight:normal;font-style:normal;text-decoration: none}
span.cls_008{font-family:Arial,serif;font-size:10.1px;color:rgb(0,0,0);font-weight:normal;font-style:normal;text-decoration: none}
div.cls_008{font-family:Arial,serif;font-size:10.1px;color:rgb(0,0,0);font-weight:normal;font-style:normal;text-decoration: none}
span.cls_018{font-family:Arial,serif;font-size:10.1px;color:rgb(17,84,204);font-weight:normal;font-style:normal;text-decoration: underline}
div.cls_018{font-family:Arial,serif;font-size:10.1px;color:rgb(17,84,204);font-weight:normal;font-style:normal;text-decoration: none}
span.cls_019{font-family:Arial,serif;font-size:11.1px;color:rgb(17,84,204);font-weight:normal;font-style:normal;text-decoration: underline}
div.cls_019{font-family:Arial,serif;font-size:11.1px;color:rgb(17,84,204);font-weight:normal;font-style:normal;text-decoration: none}
span.cls_015{font-family:"Verdana",serif;font-size:10.1px;color:rgb(35,41,45);font-weight:normal;font-style:normal;text-decoration: none}
div.cls_015{font-family:"Verdana",serif;font-size:10.1px;color:rgb(35,41,45);font-weight:normal;font-style:normal;text-decoration: none}
span.cls_014{font-family:Courier New,serif;font-size:11.1px;color:rgb(17,84,204);font-weight:normal;font-style:normal;text-decoration: none}
div.cls_014{font-family:Courier New,serif;font-size:11.1px;color:rgb(17,84,204);font-weight:normal;font-style:normal;text-decoration: none}
span.cls_016{font-family:Arial,serif;font-size:14.1px;color:rgb(67,67,67);font-weight:normal;font-style:normal;text-decoration: none}
div.cls_016{font-family:Arial,serif;font-size:14.1px;color:rgb(67,67,67);font-weight:normal;font-style:normal;text-decoration: none}
-->
</style>
<script type="text/javascript" src="4ef19dde-cb38-11e8-b59b-0cc47a792c0a_id_4ef19dde-cb38-11e8-b59b-0cc47a792c0a_files/wz_jsgraphics.js"></script>
</head>
<body>
<div style="position:absolute;left:50%;margin-left:-298px;top:0px;width:596px;height:843px;border-style:outset;overflow:hidden">
<div style="position:absolute;left:0px;top:0px">
<img src="4ef19dde-cb38-11e8-b59b-0cc47a792c0a_id_4ef19dde-cb38-11e8-b59b-0cc47a792c0a_files/background001.jpg" width=596 height=843></div>
<div style="position:absolute;left:313.01px;top:86.58px" class="cls_002"><span class="cls_002">Univerzitet u Novom Sadu</span></div>
<div style="position:absolute;left:317.52px;top:101.59px" class="cls_002"><span class="cls_002">Fakultet tehničkih nauka</span></div>
<div style="position:absolute;left:292.75px;top:116.60px" class="cls_002"><span class="cls_002">Inženjerstvo informacionih sistema</span></div>
<div style="position:absolute;left:288.24px;top:131.62px" class="cls_002"><span class="cls_002">Veb orijentisane tehnologije i sistemi</span></div>
<div style="position:absolute;left:114.85px;top:416.10px" class="cls_003"><span class="cls_003">Dokumentacija za MEAN 2 web</span></div>
<div style="position:absolute;left:243.95px;top:452.13px" class="cls_003"><span class="cls_003">aplikaciju</span></div>
<div style="position:absolute;left:246.21px;top:775.66px" class="cls_002"><span class="cls_002">Novi Sad, 2018. god.</span></div>
</div>
<div style="position:absolute;left:50%;margin-left:-298px;top:853px;width:596px;height:843px;border-style:outset;overflow:hidden">
<div style="position:absolute;left:0px;top:0px">
<img src="4ef19dde-cb38-11e8-b59b-0cc47a792c0a_id_4ef19dde-cb38-11e8-b59b-0cc47a792c0a_files/background002.jpg" width=596 height=843></div>
<div style="position:absolute;left:272.48px;top:71.57px" class="cls_005"><span class="cls_005">Sadržaj</span></div>
<div style="position:absolute;left:72.06px;top:144.38px" class="cls_006"><span class="cls_006">1. Uvod</span></div>
<div style="position:absolute;left:517.18px;top:144.38px" class="cls_006"><span class="cls_006">2</span></div>
<div style="position:absolute;left:90.08px;top:160.89px" class="cls_002"><span class="cls_002">1.1 Opis aplikacije</span></div>
<div style="position:absolute;left:517.18px;top:160.89px" class="cls_002"><span class="cls_002">2</span></div>
<div style="position:absolute;left:90.08px;top:177.40px" class="cls_002"><span class="cls_002">1.2 Tehnologije</span></div>
<div style="position:absolute;left:517.93px;top:177.40px" class="cls_002"><span class="cls_002">3</span></div>
<div style="position:absolute;left:90.08px;top:193.92px" class="cls_002"><span class="cls_002">1.3 Način korišćenja</span></div>
<div style="position:absolute;left:517.18px;top:193.92px" class="cls_002"><span class="cls_002">3</span></div>
<div style="position:absolute;left:90.08px;top:210.43px" class="cls_002"><span class="cls_002">1.4 Osnovna struktura aplikacije</span></div>
<div style="position:absolute;left:517.93px;top:210.43px" class="cls_006"><span class="cls_006">7</span></div>
<div style="position:absolute;left:72.06px;top:233.70px" class="cls_006"><span class="cls_006">2. Backend</span></div>
<div style="position:absolute;left:511.93px;top:233.70px" class="cls_006"><span class="cls_006">10</span></div>
<div style="position:absolute;left:90.08px;top:250.21px" class="cls_002"><span class="cls_002">2.1 Modeli</span></div>
<div style="position:absolute;left:511.93px;top:250.21px" class="cls_002"><span class="cls_002">14</span></div>
<div style="position:absolute;left:90.08px;top:266.73px" class="cls_002"><span class="cls_002">2.2 Rute</span></div>
<div style="position:absolute;left:511.93px;top:266.73px" class="cls_002"><span class="cls_002">16</span></div>
<div style="position:absolute;left:108.09px;top:283.24px" class="cls_002"><span class="cls_002">2.2.1 Autentifikacija</span></div>
<div style="position:absolute;left:511.93px;top:283.24px" class="cls_002"><span class="cls_002">17</span></div>
<div style="position:absolute;left:72.06px;top:306.51px" class="cls_006"><span class="cls_006">3. Frontend</span></div>
<div style="position:absolute;left:511.18px;top:306.51px" class="cls_006"><span class="cls_006">28</span></div>
<div style="position:absolute;left:90.08px;top:323.03px" class="cls_002"><span class="cls_002">3.1 Modeli</span></div>
<div style="position:absolute;left:511.93px;top:323.03px" class="cls_002"><span class="cls_002">34</span></div>
<div style="position:absolute;left:90.08px;top:339.54px" class="cls_002"><span class="cls_002">3.2 Servisi</span></div>
<div style="position:absolute;left:511.93px;top:339.54px" class="cls_002"><span class="cls_002">36</span></div>
<div style="position:absolute;left:108.09px;top:356.05px" class="cls_002"><span class="cls_002">3.2.1 HTTP Zahtevi</span></div>
<div style="position:absolute;left:511.93px;top:356.05px" class="cls_002"><span class="cls_002">37</span></div>
<div style="position:absolute;left:90.08px;top:372.57px" class="cls_002"><span class="cls_002">3.3 Komponente</span></div>
<div style="position:absolute;left:511.93px;top:372.57px" class="cls_002"><span class="cls_002">51</span></div>
<div style="position:absolute;left:72.06px;top:395.84px" class="cls_006"><span class="cls_006">4. Ostalo</span></div>
<div style="position:absolute;left:511.18px;top:395.84px" class="cls_006"><span class="cls_006">80</span></div>
<div style="position:absolute;left:90.08px;top:412.35px" class="cls_002"><span class="cls_002">4.1 Linkovi</span></div>
<div style="position:absolute;left:511.93px;top:412.35px" class="cls_002"><span class="cls_002">80</span></div>
<div style="position:absolute;left:90.08px;top:428.86px" class="cls_002"><span class="cls_002">4.2 Sajt</span></div>
<div style="position:absolute;left:511.18px;top:428.86px" class="cls_002"><span class="cls_002">82</span></div>
<div style="position:absolute;left:90.08px;top:445.38px" class="cls_002"><span class="cls_002">4.3Bazapodataka</span></div>
<div style="position:absolute;left:511.93px;top:445.38px" class="cls_002"><span class="cls_002">87</span></div>
<div style="position:absolute;left:517.18px;top:822.19px" class="cls_002"><span class="cls_002">2</span></div>
</div>
<div style="position:absolute;left:50%;margin-left:-298px;top:1706px;width:596px;height:843px;border-style:outset;overflow:hidden">
<div style="position:absolute;left:0px;top:0px">
<img src="4ef19dde-cb38-11e8-b59b-0cc47a792c0a_id_4ef19dde-cb38-11e8-b59b-0cc47a792c0a_files/background003.jpg" width=596 height=843></div>
<div style="position:absolute;left:72.06px;top:327.53px" class="cls_007"><span class="cls_007">1. Uvod</span></div>
<div style="position:absolute;left:72.06px;top:393.83px" class="cls_004"><span class="cls_004">1.1 Opis aplikacije</span></div>
<div style="position:absolute;left:72.06px;top:422.36px" class="cls_008"><span class="cls_008">U pitanju je web aplikacija za trgovanje knjigama.</span></div>
<div style="position:absolute;left:72.06px;top:449.38px" class="cls_008"><span class="cls_008">Registrovani korisnici imaju mogućnost postavljanja knjiga za prodaju, kupovine knjiga od strane</span></div>
<div style="position:absolute;left:72.06px;top:462.89px" class="cls_008"><span class="cls_008">drugih korisnika, učestvovanje na forumu, ocenjivanja i komentarisanja kako knjiga, tako i iskustva sa</span></div>
<div style="position:absolute;left:72.06px;top:476.40px" class="cls_008"><span class="cls_008">određenim korisnicima u trgovini.</span></div>
<div style="position:absolute;left:72.06px;top:503.42px" class="cls_008"><span class="cls_008">Posetioci koji nisu registrovani imaju mogućnost pregleda dostupnih knjiga, objava na forumu i objava</span></div>
<div style="position:absolute;left:72.06px;top:516.94px" class="cls_008"><span class="cls_008">od strane drugih korisnika.</span></div>
<div style="position:absolute;left:72.06px;top:543.96px" class="cls_008"><span class="cls_008">Administator ima sve mogućnosti kao i registrovani korisnik, s tim da može još da: briše i menja sve</span></div>
<div style="position:absolute;left:72.06px;top:557.47px" class="cls_008"><span class="cls_008">knjige, vidi listu svih registrovanih korisnika sajta, briše i menja sve objave na forumu.</span></div>
<div style="position:absolute;left:72.06px;top:588.25px" class="cls_004"><span class="cls_004">1.2 Tehnologije</span></div>
<div style="position:absolute;left:72.06px;top:630.28px" class="cls_008"><span class="cls_008">Za izradu aplikacije su korišćene sledeće tehnologije:</span></div>
<div style="position:absolute;left:72.06px;top:643.79px" class="cls_008"><span class="cls_008">Angular, HTML; CSS i Bootstrap za Frontend i</span></div>
<div style="position:absolute;left:72.06px;top:657.30px" class="cls_008"><span class="cls_008">NodeJS, ExpressJS, Moongose i MongoDB za Backend.</span></div>
<div style="position:absolute;left:72.06px;top:684.33px" class="cls_008"><span class="cls_008">Za izradu aplikacije je korišćeno razvojno okruženje Visual Studio Code</span></div>
<div style="position:absolute;left:72.06px;top:697.84px" class="cls_008"><span class="cls_008">(</span><span class="cls_018">h<A HREF="https://code.visualstudio.com/">ttps://code.visualstudio.com/</A> </span><span class="cls_008">).</span></div>
<div style="position:absolute;left:72.06px;top:724.86px" class="cls_008"><span class="cls_008">Aplikacija je hostovana na besplatni servis Heroku (</span><A HREF="https://www.heroku.com/">https://www.heroku.com/</A>), dok se baza podataka</div>
<div style="position:absolute;left:72.06px;top:738.37px" class="cls_008"><span class="cls_008">nalazi na platformi Mlab (</span><A HREF="https://mlab.com/">https://mlab.com/</A>).</div>
<div style="position:absolute;left:517.18px;top:822.19px" class="cls_002"><span class="cls_002">3</span></div>
</div>
<div style="position:absolute;left:50%;margin-left:-298px;top:2559px;width:596px;height:843px;border-style:outset;overflow:hidden">
<div style="position:absolute;left:0px;top:0px">
<img src="4ef19dde-cb38-11e8-b59b-0cc47a792c0a_id_4ef19dde-cb38-11e8-b59b-0cc47a792c0a_files/background004.jpg" width=596 height=843></div>
<div style="position:absolute;left:72.06px;top:89.08px" class="cls_004"><span class="cls_004">1.3 Način korišćenja</span></div>
<div style="position:absolute;left:72.06px;top:117.35px" class="cls_002"><span class="cls_002">Za lokalno pokretanje aplikacije neophodno je imati instaliran</span></div>
<div style="position:absolute;left:72.06px;top:132.37px" class="cls_002"><span class="cls_002">NodeJS(</span><span class="cls_019">h<A HREF="https://nodejs.org/en/">ttps://nodejs.org/en/</A> </span><span class="cls_002">), Node Package Manager (NPM) i Mongodb bazu podataka</span></div>
<div style="position:absolute;left:72.06px;top:147.38px" class="cls_002"><span class="cls_002">(</span><span class="cls_019">h<A HREF="https://www.mongodb.com/download-center?jmp=nav#community">ttps://www.mongodb.com/download-center?jmp=nav#community</A> </span><span class="cls_002">).</span></div>
<div style="position:absolute;left:72.06px;top:177.40px" class="cls_002"><span class="cls_002">Prvo je neophodno klonirati sledeći repozitorijum:</span></div>
<div style="position:absolute;left:72.06px;top:192.42px" class="cls_002"><span class="cls_002"> </span><A HREF="https://github.com/vukan-markovic/book-trading-club./">https://github.com/Vukan-Markovic/Book-trading-club.</A> </div>
<div style="position:absolute;left:72.06px;top:222.44px" class="cls_002"><span class="cls_002">Nakon toga je potrebno izvršiti sledeće komande (u command prompt-u, u folderu gde se</span></div>
<div style="position:absolute;left:72.06px;top:237.45px" class="cls_002"><span class="cls_002">nalazi projekat):</span></div>
<div style="position:absolute;left:72.06px;top:252.47px" class="cls_002"><span class="cls_002">1.</span><span class="cls_015">npm install - za instaliranje zavisnosti</span></div>
<div style="position:absolute;left:72.06px;top:267.48px" class="cls_002"><span class="cls_002">2. npm run-script build - za pokretanje frontend dela</span></div>
<div style="position:absolute;left:72.06px;top:282.49px" class="cls_002"><span class="cls_002">3. npm start - za pokretanje backend dela</span></div>
<div style="position:absolute;left:72.06px;top:312.52px" class="cls_002"><span class="cls_002">Aplikacija se takođe nalazi na sajtu: </span><span class="cls_019">h<A HREF="https://bookclubtrading.herokuapp.com/">ttps://bookclubtrading.herokuapp.com/</A> </span><span class="cls_002">.</span></div>
<div style="position:absolute;left:72.06px;top:327.53px" class="cls_002"><span class="cls_002">Kompletan kod je dostupan na sledećem linku:</span></div>
<div style="position:absolute;left:72.06px;top:342.54px" class="cls_002"><span class="cls_002"> </span><A HREF="https://github.com/vukan-markovic/book-trading-club./">https://github.com/Vukan-Markovic/Book-trading-club.</A> </div>
<div style="position:absolute;left:72.06px;top:375.07px" class="cls_004"><span class="cls_004">1.4 Osnovna struktura aplikacije</span></div>
<div style="position:absolute;left:72.06px;top:403.34px" class="cls_002"><span class="cls_002">Osnovna struktura aplikacije je kreirana upotrebom ExpressJS generatora</span></div>
<div style="position:absolute;left:72.06px;top:418.36px" class="cls_002"><span class="cls_002">(</span><A HREF="https://expressjs.com/en/starter/generator.html">https://expressjs.com/en/starter/generator.html</A>).</div>
<div style="position:absolute;left:72.06px;top:448.38px" class="cls_002"><span class="cls_002">Za generisanje strukture aplikacije ExpressJS generatorom potrebno je izvršiti sledeće</span></div>
<div style="position:absolute;left:72.06px;top:463.39px" class="cls_002"><span class="cls_002">komande:</span></div>
<div style="position:absolute;left:90.08px;top:478.41px" class="cls_002"><span class="cls_002">1. npm install -g express-generator - instaliranje express js framework-a</span></div>
<div style="position:absolute;left:90.08px;top:493.42px" class="cls_002"><span class="cls_002">2. express mojaPrvaAplikacija - generisanje aplikacije sa Jade templating-om:</span></div>
<div style="position:absolute;left:90.08px;top:508.43px" class="cls_002"><span class="cls_002">3. npm install - instaliranje zavisnosti.</span></div>
<div style="position:absolute;left:517.18px;top:822.19px" class="cls_002"><span class="cls_002">4</span></div>
</div>
<div style="position:absolute;left:50%;margin-left:-298px;top:3412px;width:596px;height:843px;border-style:outset;overflow:hidden">
<div style="position:absolute;left:0px;top:0px">
<img src="4ef19dde-cb38-11e8-b59b-0cc47a792c0a_id_4ef19dde-cb38-11e8-b59b-0cc47a792c0a_files/background005.jpg" width=596 height=843></div>
<div style="position:absolute;left:72.06px;top:86.58px" class="cls_002"><span class="cls_002">Glavne celine aplikacije:</span></div>
<div style="position:absolute;left:72.06px;top:116.60px" class="cls_002"><span class="cls_002">-Backend:</span></div>
<div style="position:absolute;left:72.06px;top:131.62px" class="cls_002"><span class="cls_002">• Osnovna Express i Serverska konfiguracija</span></div>
<div style="position:absolute;left:72.06px;top:146.63px" class="cls_002"><span class="cls_002">• Modeli</span></div>
<div style="position:absolute;left:72.06px;top:161.64px" class="cls_002"><span class="cls_002">• Rute i kontroleri vezani za njih - odgovaraju HTTP zahtevima</span></div>
<div style="position:absolute;left:72.06px;top:176.65px" class="cls_002"><span class="cls_002">• Autentifikacija</span></div>
<div style="position:absolute;left:72.06px;top:206.68px" class="cls_002"><span class="cls_002">-Frontend:</span></div>
<div style="position:absolute;left:72.06px;top:221.69px" class="cls_002"><span class="cls_002">• Modeli</span></div>
<div style="position:absolute;left:72.06px;top:236.70px" class="cls_002"><span class="cls_002">• Komponente</span></div>
<div style="position:absolute;left:72.06px;top:251.72px" class="cls_002"><span class="cls_002">• Servisi</span></div>
<div style="position:absolute;left:72.06px;top:266.73px" class="cls_002"><span class="cls_002">• Rute</span></div>
<div style="position:absolute;left:72.06px;top:281.74px" class="cls_002"><span class="cls_002">• Stilizacija</span></div>
<div style="position:absolute;left:72.06px;top:296.75px" class="cls_002"><span class="cls_002">• Autentifikacija</span></div>
<div style="position:absolute;left:517.18px;top:822.19px" class="cls_002"><span class="cls_002">5</span></div>
</div>
<div style="position:absolute;left:50%;margin-left:-298px;top:4265px;width:596px;height:843px;border-style:outset;overflow:hidden">
<div style="position:absolute;left:0px;top:0px">
<img src="4ef19dde-cb38-11e8-b59b-0cc47a792c0a_id_4ef19dde-cb38-11e8-b59b-0cc47a792c0a_files/background006.jpg" width=596 height=843></div>
<div style="position:absolute;left:216.18px;top:475.40px" class="cls_002"><span class="cls_002">Slika 1. Glavna struktura aplikacije</span></div>
<div style="position:absolute;left:517.18px;top:822.19px" class="cls_002"><span class="cls_002">6</span></div>
</div>
<div style="position:absolute;left:50%;margin-left:-298px;top:5118px;width:596px;height:843px;border-style:outset;overflow:hidden">
<div style="position:absolute;left:0px;top:0px">
<img src="4ef19dde-cb38-11e8-b59b-0cc47a792c0a_id_4ef19dde-cb38-11e8-b59b-0cc47a792c0a_files/background007.jpg" width=596 height=843></div>
<div style="position:absolute;left:108.09px;top:608.27px" class="cls_002"><span class="cls_002">Slika 2. Backend struktura aplikacije</span></div>
<div style="position:absolute;left:517.18px;top:822.19px" class="cls_002"><span class="cls_002">7</span></div>
</div>
<div style="position:absolute;left:50%;margin-left:-298px;top:5971px;width:596px;height:843px;border-style:outset;overflow:hidden">
<div style="position:absolute;left:0px;top:0px">
<img src="4ef19dde-cb38-11e8-b59b-0cc47a792c0a_id_4ef19dde-cb38-11e8-b59b-0cc47a792c0a_files/background008.jpg" width=596 height=843></div>
<div style="position:absolute;left:72.06px;top:578.99px" class="cls_002"><span class="cls_002">Slika 3. Frontend struktura aplikacije</span></div>
<div style="position:absolute;left:517.18px;top:822.19px" class="cls_002"><span class="cls_002">8</span></div>
</div>
<div style="position:absolute;left:50%;margin-left:-298px;top:6824px;width:596px;height:843px;border-style:outset;overflow:hidden">
<div style="position:absolute;left:0px;top:0px">
<img src="4ef19dde-cb38-11e8-b59b-0cc47a792c0a_id_4ef19dde-cb38-11e8-b59b-0cc47a792c0a_files/background009.jpg" width=596 height=843></div>
<div style="position:absolute;left:72.06px;top:86.58px" class="cls_002"><span class="cls_002">Aplikacija je razvijana pod MIT licencom.</span></div>
<div style="position:absolute;left:252.21px;top:452.89px" class="cls_002"><span class="cls_002">Slika 4. LICENSE fajl</span></div>
<div style="position:absolute;left:72.06px;top:482.91px" class="cls_002"><span class="cls_002">package.json fajl je prisutan je u root direktorijumu u svakoj Node aplikaciji ili modulu i koristi</span></div>
<div style="position:absolute;left:72.06px;top:497.92px" class="cls_002"><span class="cls_002">se za definisanje svojstva paketa.</span></div>
<div style="position:absolute;left:517.18px;top:822.20px" class="cls_002"><span class="cls_002">9</span></div>
</div>
<div style="position:absolute;left:50%;margin-left:-298px;top:7677px;width:596px;height:843px;border-style:outset;overflow:hidden">
<div style="position:absolute;left:0px;top:0px">
<img src="4ef19dde-cb38-11e8-b59b-0cc47a792c0a_id_4ef19dde-cb38-11e8-b59b-0cc47a792c0a_files/background010.jpg" width=596 height=843></div>
<div style="position:absolute;left:511.18px;top:822.19px" class="cls_002"><span class="cls_002">10</span></div>
</div>
<div style="position:absolute;left:50%;margin-left:-298px;top:8530px;width:596px;height:843px;border-style:outset;overflow:hidden">
<div style="position:absolute;left:0px;top:0px">
<img src="4ef19dde-cb38-11e8-b59b-0cc47a792c0a_id_4ef19dde-cb38-11e8-b59b-0cc47a792c0a_files/background011.jpg" width=596 height=843></div>
<div style="position:absolute;left:216.18px;top:647.30px" class="cls_002"><span class="cls_002">Slika 6. Zavisnosti u package.json fajlu</span></div>
<div style="position:absolute;left:511.18px;top:822.19px" class="cls_002"><span class="cls_002">11</span></div>
</div>
<div style="position:absolute;left:50%;margin-left:-298px;top:9383px;width:596px;height:843px;border-style:outset;overflow:hidden">
<div style="position:absolute;left:0px;top:0px">
<img src="4ef19dde-cb38-11e8-b59b-0cc47a792c0a_id_4ef19dde-cb38-11e8-b59b-0cc47a792c0a_files/background012.jpg" width=596 height=843></div>
<div style="position:absolute;left:72.06px;top:138.37px" class="cls_007"><span class="cls_007">2. Backend</span></div>
<div style="position:absolute;left:72.06px;top:187.16px" class="cls_002"><span class="cls_002">U </span><span class="cls_019">w<A HREF="http://www.js/">ww.js</A> </span><span class="cls_014"> </span><span class="cls_002">fajlu se vrši kreiranje servera i kreiranje i podešavanje porta. Ovaj kod je</span></div>
<div style="position:absolute;left:72.06px;top:202.17px" class="cls_002"><span class="cls_002">automatski generisan od strane ExpressJS generatora.</span></div>
<div style="position:absolute;left:511.18px;top:822.19px" class="cls_002"><span class="cls_002">12</span></div>
</div>
<div style="position:absolute;left:50%;margin-left:-298px;top:10236px;width:596px;height:843px;border-style:outset;overflow:hidden">
<div style="position:absolute;left:0px;top:0px">
<img src="4ef19dde-cb38-11e8-b59b-0cc47a792c0a_id_4ef19dde-cb38-11e8-b59b-0cc47a792c0a_files/background013.jpg" width=596 height=843></div>
<div style="position:absolute;left:216.18px;top:554.97px" class="cls_002"><span class="cls_002">Slika 8. Serverski </span><span class="cls_019">w<A HREF="http://www.js/">ww.js</A> </span><span class="cls_014"> </span><span class="cls_002">fajl</span></div>
<div style="position:absolute;left:511.18px;top:822.19px" class="cls_002"><span class="cls_002">13</span></div>
</div>
<div style="position:absolute;left:50%;margin-left:-298px;top:11089px;width:596px;height:843px;border-style:outset;overflow:hidden">
<div style="position:absolute;left:0px;top:0px">
<img src="4ef19dde-cb38-11e8-b59b-0cc47a792c0a_id_4ef19dde-cb38-11e8-b59b-0cc47a792c0a_files/background014.jpg" width=596 height=843></div>
<div style="position:absolute;left:72.06px;top:71.56px" class="cls_002"><span class="cls_002">app.js predstavlja glavni serverski fajl aplikacije. U njemu se prvo se importuju svi potrebni</span></div>
<div style="position:absolute;left:72.06px;top:86.58px" class="cls_002"><span class="cls_002">moduli a zatim definišu sve rute koje će se koristiti u aplikaciji. Nakon toga se vrši</span></div>
<div style="position:absolute;left:72.06px;top:101.59px" class="cls_002"><span class="cls_002">konektovanje na bazu podataka. Ostala serverska podešavanja su automatski generisana</span></div>
<div style="position:absolute;left:72.06px;top:116.60px" class="cls_002"><span class="cls_002">od strane ExpressJS generatora.</span></div>
<div style="position:absolute;left:216.18px;top:710.35px" class="cls_002"><span class="cls_002">Slika 9. Serverski app.js fajl</span></div>
<div style="position:absolute;left:511.18px;top:822.19px" class="cls_002"><span class="cls_002">14</span></div>
</div>
<div style="position:absolute;left:50%;margin-left:-298px;top:11942px;width:596px;height:843px;border-style:outset;overflow:hidden">
<div style="position:absolute;left:0px;top:0px">
<img src="4ef19dde-cb38-11e8-b59b-0cc47a792c0a_id_4ef19dde-cb38-11e8-b59b-0cc47a792c0a_files/background015.jpg" width=596 height=843></div>
<div style="position:absolute;left:216.18px;top:452.88px" class="cls_002"><span class="cls_002">Slika 10. Serverski app.js fajl</span></div>
<div style="position:absolute;left:72.06px;top:482.91px" class="cls_002"><span class="cls_002">U database.js fajlu se nalazi modul sa linkom na Mlab bazu podataka.</span></div>
<div style="position:absolute;left:252.21px;top:650.30px" class="cls_002"><span class="cls_002">Slika 11. database.js fajl</span></div>
<div style="position:absolute;left:511.18px;top:822.19px" class="cls_002"><span class="cls_002">15</span></div>
</div>
<div style="position:absolute;left:50%;margin-left:-298px;top:12795px;width:596px;height:843px;border-style:outset;overflow:hidden">
<div style="position:absolute;left:0px;top:0px">
<img src="4ef19dde-cb38-11e8-b59b-0cc47a792c0a_id_4ef19dde-cb38-11e8-b59b-0cc47a792c0a_files/background016.jpg" width=596 height=843></div>
<div style="position:absolute;left:72.06px;top:168.64px" class="cls_004"><span class="cls_004">2.1 Modeli</span></div>
<div style="position:absolute;left:72.06px;top:196.92px" class="cls_002"><span class="cls_002">MongoDB rukuje jednostavnim JSON dokumentima. Poslovna logika je smeštena u</span></div>
<div style="position:absolute;left:72.06px;top:211.93px" class="cls_002"><span class="cls_002">aplikativni sloj. Mongoose ODM nam omogućuje jednostavnu konverziju između</span></div>
<div style="position:absolute;left:72.06px;top:226.95px" class="cls_002"><span class="cls_002">dokumenata i JavaScript objekata</span></div>
<div style="position:absolute;left:72.06px;top:256.97px" class="cls_002"><span class="cls_002">Mongoose nam služi za struktuiranje podataka. Ne može se skladištiti ništa što ne odgovara</span></div>
<div style="position:absolute;left:72.06px;top:271.98px" class="cls_002"><span class="cls_002">šemi. Šema sluzi kao deklaracija kako treba da izgledaju podaci.</span></div>
<div style="position:absolute;left:72.06px;top:287.00px" class="cls_002"><span class="cls_002">Modeli su prave klase kreirane u JavaScript-i.</span></div>
<div style="position:absolute;left:72.06px;top:317.02px" class="cls_002"><span class="cls_002">U aplikaciji postoje četiri modela i to:</span></div>
<div style="position:absolute;left:90.08px;top:332.03px" class="cls_002"><span class="cls_002">1. user.js - model koji reprezentuje korisnika</span></div>
<div style="position:absolute;left:90.08px;top:347.05px" class="cls_002"><span class="cls_002">2. post.js - model koji reprezentuje objavu na forumu</span></div>
<div style="position:absolute;left:90.08px;top:362.06px" class="cls_002"><span class="cls_002">3. comment.js - model koji reprezentuje komentar o knjizi</span></div>
<div style="position:absolute;left:90.08px;top:377.07px" class="cls_002"><span class="cls_002">4. book.js - model koji reprezentuje knjigu</span></div>
<div style="position:absolute;left:252.21px;top:732.12px" class="cls_002"><span class="cls_002">Slika 12. model (šema) knjige</span></div>
<div style="position:absolute;left:511.18px;top:822.20px" class="cls_002"><span class="cls_002">16</span></div>
</div>
<div style="position:absolute;left:50%;margin-left:-298px;top:13648px;width:596px;height:843px;border-style:outset;overflow:hidden">
<div style="position:absolute;left:0px;top:0px">
<img src="4ef19dde-cb38-11e8-b59b-0cc47a792c0a_id_4ef19dde-cb38-11e8-b59b-0cc47a792c0a_files/background017.jpg" width=596 height=843></div>
<div style="position:absolute;left:216.18px;top:427.36px" class="cls_002"><span class="cls_002">Slika 13. model (šema) komentara o knjizi</span></div>
<div style="position:absolute;left:216.18px;top:735.87px" class="cls_002"><span class="cls_002">Slika 14. model (šema) objave na forumu</span></div>
<div style="position:absolute;left:511.18px;top:822.20px" class="cls_002"><span class="cls_002">17</span></div>
</div>
<div style="position:absolute;left:50%;margin-left:-298px;top:14501px;width:596px;height:843px;border-style:outset;overflow:hidden">
<div style="position:absolute;left:0px;top:0px">
<img src="4ef19dde-cb38-11e8-b59b-0cc47a792c0a_id_4ef19dde-cb38-11e8-b59b-0cc47a792c0a_files/background018.jpg" width=596 height=843></div>
<div style="position:absolute;left:180.15px;top:394.34px" class="cls_002"><span class="cls_002">Slika 15. Model (šema) registrovanog korisnika sajta</span></div>
<div style="position:absolute;left:72.06px;top:441.87px" class="cls_004"><span class="cls_004">2.2 Rute</span></div>
<div style="position:absolute;left:72.06px;top:485.16px" class="cls_002"><span class="cls_002">Rutiranje se odnosi na to kako aplikacija odgovra na klijentske zahteve u zavisnotsti od</span></div>
<div style="position:absolute;left:72.06px;top:500.17px" class="cls_002"><span class="cls_002">endpoint-a, HTTP zahteva (GET, POST,…), URI-a…</span></div>
<div style="position:absolute;left:72.06px;top:530.20px" class="cls_002"><span class="cls_002">Vrši se parsiranje tela zahteva i preuzimanje parametara (parsiranje se vrši ukoliko je</span></div>
<div style="position:absolute;left:72.06px;top:545.21px" class="cls_002"><span class="cls_002">content-type application/JSON ili application/x-www-form-urlencoded).</span></div>
<div style="position:absolute;left:72.06px;top:575.24px" class="cls_002"><span class="cls_002">Upiti ka bazi su zahtevni prema resursima. Zato se koriste kroz Callback-ove. Šalje se</span></div>
<div style="position:absolute;left:72.06px;top:590.25px" class="cls_002"><span class="cls_002">zahtev, obrađuju se drugi poslovi, i kada se dobije povratna vrednost upita, izvrsava se</span></div>
<div style="position:absolute;left:72.06px;top:605.26px" class="cls_002"><span class="cls_002">callback funkcija. Upiti su uvek u formatu: function(error, result) {...}.</span></div>
<div style="position:absolute;left:72.06px;top:635.29px" class="cls_002"><span class="cls_002">Express framework omogucuje integrisanje middleware-a za odgovor na HTTP zahteve,</span></div>
<div style="position:absolute;left:72.06px;top:650.30px" class="cls_002"><span class="cls_002">definisanje ruting tabele radi implementacije raznih akcija u zavisnosti od URL-a i HTTP</span></div>
<div style="position:absolute;left:72.06px;top:665.31px" class="cls_002"><span class="cls_002">metoda kao i dinamičko renderovanje HTML strana bazirano na prosleđivanju argumenata</span></div>
<div style="position:absolute;left:72.06px;top:680.33px" class="cls_002"><span class="cls_002">templejtu.</span></div>
<div style="position:absolute;left:72.06px;top:710.35px" class="cls_002"><span class="cls_002">Express aplikacije koriste callback funkcije čiji su parametri request i response objekti.</span></div>
<div style="position:absolute;left:511.18px;top:822.19px" class="cls_002"><span class="cls_002">18</span></div>
</div>
<div style="position:absolute;left:50%;margin-left:-298px;top:15354px;width:596px;height:843px;border-style:outset;overflow:hidden">
<div style="position:absolute;left:0px;top:0px">
<img src="4ef19dde-cb38-11e8-b59b-0cc47a792c0a_id_4ef19dde-cb38-11e8-b59b-0cc47a792c0a_files/background019.jpg" width=596 height=843></div>
<div style="position:absolute;left:72.06px;top:71.56px" class="cls_002"><span class="cls_002">Request objekat predstavlja HTTP zahtev i poseduje propertije za query string, pararametre,</span></div>
<div style="position:absolute;left:72.06px;top:86.58px" class="cls_002"><span class="cls_002">body, HTTP hedere… Response objekat predstavlja HTTP odgovor koji Express aplikacija</span></div>
<div style="position:absolute;left:72.06px;top:101.59px" class="cls_002"><span class="cls_002">šalje kao odgovor na zahtev.</span></div>
<div style="position:absolute;left:72.06px;top:131.62px" class="cls_002"><span class="cls_002">Pri tome body-parse middleware nam služi za rukovanje JSON, Text, URL enkodovanim i</span></div>
<div style="position:absolute;left:72.06px;top:146.63px" class="cls_002"><span class="cls_002">sirovim podacima.</span></div>
<div style="position:absolute;left:72.06px;top:192.42px" class="cls_016"><span class="cls_016">2.2.1 Autentifikacija</span></div>
<div style="position:absolute;left:72.06px;top:230.70px" class="cls_002"><span class="cls_002">Svi zahtevi sa klijenta stižu preko tokena. Korisiti se JWT - JSON web tokens</span></div>
<div style="position:absolute;left:72.06px;top:260.72px" class="cls_002"><span class="cls_002">Svi zahtevi su autentifikovani. Prilikom logovanja token se šalje korisniku sa servera, pri</span></div>
<div style="position:absolute;left:72.06px;top:275.74px" class="cls_002"><span class="cls_002">čemu se čuva u LocalStorage na klijentu. U token-u se čuvaju enkriptovane informacije o</span></div>
<div style="position:absolute;left:72.06px;top:290.75px" class="cls_002"><span class="cls_002">korisniku. Vreme trajanja tokena je proizvoljno, u aplikaciji je 10800s.</span></div>
<div style="position:absolute;left:72.06px;top:320.77px" class="cls_002"><span class="cls_002">Za svaki zahtev prema bazi, korisnik se verifikuje preko tokena. Ako je token verifikovan, iz</span></div>
<div style="position:absolute;left:72.06px;top:335.79px" class="cls_002"><span class="cls_002">njega se izvlače informacije o korisniku I akcije ka bazi vezane su samo za korisnikove</span></div>
<div style="position:absolute;left:72.06px;top:350.80px" class="cls_002"><span class="cls_002">podatke.</span></div>
<div style="position:absolute;left:72.06px;top:385.33px" class="cls_002"><span class="cls_002">U aplikaciji postoje četiri rute i to:</span></div>
<div style="position:absolute;left:90.08px;top:400.34px" class="cls_002"><span class="cls_002">1. user.js - ruta za sve zahteve vezane za korisnike (registracija, logovanje, promena</span></div>
<div style="position:absolute;left:108.09px;top:415.35px" class="cls_002"><span class="cls_002">profilne slike)</span></div>
<div style="position:absolute;left:90.08px;top:430.37px" class="cls_002"><span class="cls_002">2. post.js - ruta za sve zahteve za objave (dodavanje novih objava, njihovo brisanje i</span></div>
<div style="position:absolute;left:108.09px;top:445.38px" class="cls_002"><span class="cls_002">ažuriranje od strane administratora)</span></div>
<div style="position:absolute;left:90.08px;top:460.39px" class="cls_002"><span class="cls_002">3. comment.js - ruta koja reprezentuje sve zahteve vezane za komentare komentar o</span></div>
<div style="position:absolute;left:108.09px;top:475.40px" class="cls_002"><span class="cls_002">knjigama (dodavanje novog komentara)</span></div>
<div style="position:absolute;left:90.08px;top:490.42px" class="cls_002"><span class="cls_002">4. book.js - ruta koja reprezentuje sve zahteve vezane za knjige (dodavanje knjige,</span></div>
<div style="position:absolute;left:108.09px;top:505.43px" class="cls_002"><span class="cls_002">brisanje, ažuriranje, pregled knjige, kao i brisanje i ažuriranje od strane</span></div>
<div style="position:absolute;left:108.09px;top:520.44px" class="cls_002"><span class="cls_002">administratora koji može da briše i ažurira sve knjige).</span></div>
<div style="position:absolute;left:511.18px;top:822.19px" class="cls_002"><span class="cls_002">19</span></div>
</div>
<div style="position:absolute;left:50%;margin-left:-298px;top:16207px;width:596px;height:843px;border-style:outset;overflow:hidden">
<div style="position:absolute;left:0px;top:0px">
<img src="4ef19dde-cb38-11e8-b59b-0cc47a792c0a_id_4ef19dde-cb38-11e8-b59b-0cc47a792c0a_files/background020.jpg" width=596 height=843></div>
<div style="position:absolute;left:144.12px;top:526.45px" class="cls_002"><span class="cls_002">Slika 16. GET zahtev za sve komentare za određenu knjigu</span></div>
<div style="position:absolute;left:511.18px;top:822.19px" class="cls_002"><span class="cls_002">20</span></div>
</div>
<div style="position:absolute;left:50%;margin-left:-298px;top:17060px;width:596px;height:843px;border-style:outset;overflow:hidden">
<div style="position:absolute;left:0px;top:0px">
<img src="4ef19dde-cb38-11e8-b59b-0cc47a792c0a_id_4ef19dde-cb38-11e8-b59b-0cc47a792c0a_files/background021.jpg" width=596 height=843></div>
<div style="position:absolute;left:144.12px;top:456.64px" class="cls_002"><span class="cls_002">Slika 17. POST zahtev za dodavanje novog komentara o knjizi ili korisniku</span></div>
<div style="position:absolute;left:511.18px;top:822.19px" class="cls_002"><span class="cls_002">21</span></div>
</div>
<div style="position:absolute;left:50%;margin-left:-298px;top:17913px;width:596px;height:843px;border-style:outset;overflow:hidden">
<div style="position:absolute;left:0px;top:0px">
<img src="4ef19dde-cb38-11e8-b59b-0cc47a792c0a_id_4ef19dde-cb38-11e8-b59b-0cc47a792c0a_files/background022.jpg" width=596 height=843></div>
<div style="position:absolute;left:108.09px;top:452.88px" class="cls_002"><span class="cls_002">Slika 18. Osnovna ruta home stranice, prikazuju se sve knjige svih korisnika</span></div>
<div style="position:absolute;left:511.18px;top:822.19px" class="cls_002"><span class="cls_002">22</span></div>
</div>
<div style="position:absolute;left:50%;margin-left:-298px;top:18766px;width:596px;height:843px;border-style:outset;overflow:hidden">
<div style="position:absolute;left:0px;top:0px">
<img src="4ef19dde-cb38-11e8-b59b-0cc47a792c0a_id_4ef19dde-cb38-11e8-b59b-0cc47a792c0a_files/background023.jpg" width=596 height=843></div>
<div style="position:absolute;left:144.12px;top:591.75px" class="cls_002"><span class="cls_002">Slika 19. GET zahtevi za sve korisnike i za pojedinačnog korisnika, kao i</span></div>
<div style="position:absolute;left:144.12px;top:606.76px" class="cls_002"><span class="cls_002">POST zahtev za registraciju</span></div>
<div style="position:absolute;left:511.18px;top:822.19px" class="cls_002"><span class="cls_002">23</span></div>
</div>
<div style="position:absolute;left:50%;margin-left:-298px;top:19619px;width:596px;height:843px;border-style:outset;overflow:hidden">
<div style="position:absolute;left:0px;top:0px">
<img src="4ef19dde-cb38-11e8-b59b-0cc47a792c0a_id_4ef19dde-cb38-11e8-b59b-0cc47a792c0a_files/background024.jpg" width=596 height=843></div>
<div style="position:absolute;left:216.18px;top:466.40px" class="cls_002"><span class="cls_002">Slika 20. POST zahtev za logovanje</span></div>
<div style="position:absolute;left:511.18px;top:822.19px" class="cls_002"><span class="cls_002">24</span></div>
</div>
<div style="position:absolute;left:50%;margin-left:-298px;top:20472px;width:596px;height:843px;border-style:outset;overflow:hidden">
<div style="position:absolute;left:0px;top:0px">
<img src="4ef19dde-cb38-11e8-b59b-0cc47a792c0a_id_4ef19dde-cb38-11e8-b59b-0cc47a792c0a_files/background025.jpg" width=596 height=843></div>
<div style="position:absolute;left:72.06px;top:634.54px" class="cls_002"><span class="cls_002">Slika 21. PATCH zahtev za ažuriranjem profile slike, prilikom registracije korisniku se šalje</span></div>
<div style="position:absolute;left:72.06px;top:649.55px" class="cls_002"><span class="cls_002">mejl dobrodošlice koristeći nodemailer module</span></div>
<div style="position:absolute;left:72.06px;top:664.56px" class="cls_002"><span class="cls_002">(</span><A HREF="https://www.w3schools.com/nodejs/nodejs_email.asp/">https://www.w3schools.com/nodejs/nodejs_email.asp</A>)</div>
<div style="position:absolute;left:511.18px;top:822.19px" class="cls_002"><span class="cls_002">25</span></div>
</div>
<div style="position:absolute;left:50%;margin-left:-298px;top:21325px;width:596px;height:843px;border-style:outset;overflow:hidden">
<div style="position:absolute;left:0px;top:0px">
<img src="4ef19dde-cb38-11e8-b59b-0cc47a792c0a_id_4ef19dde-cb38-11e8-b59b-0cc47a792c0a_files/background026.jpg" width=596 height=843></div>
<div style="position:absolute;left:144.12px;top:582.74px" class="cls_002"><span class="cls_002">Slika 22. GET zahtev za sve objave i za pojedinačnu objavu</span></div>
<div style="position:absolute;left:511.18px;top:822.19px" class="cls_002"><span class="cls_002">26</span></div>
</div>
<div style="position:absolute;left:50%;margin-left:-298px;top:22178px;width:596px;height:843px;border-style:outset;overflow:hidden">
<div style="position:absolute;left:0px;top:0px">
<img src="4ef19dde-cb38-11e8-b59b-0cc47a792c0a_id_4ef19dde-cb38-11e8-b59b-0cc47a792c0a_files/background027.jpg" width=596 height=843></div>
<div style="position:absolute;left:72.06px;top:613.52px" class="cls_002"><span class="cls_002">Slika 23. GET zahtevi za knjige koje pripadaju određenom korisniku za i pojedinačnu knjigu</span></div>
<div style="position:absolute;left:511.18px;top:822.19px" class="cls_002"><span class="cls_002">27</span></div>
</div>
<div style="position:absolute;left:50%;margin-left:-298px;top:23031px;width:596px;height:843px;border-style:outset;overflow:hidden">
<div style="position:absolute;left:0px;top:0px">
<img src="4ef19dde-cb38-11e8-b59b-0cc47a792c0a_id_4ef19dde-cb38-11e8-b59b-0cc47a792c0a_files/background028.jpg" width=596 height=843></div>
<div style="position:absolute;left:144.12px;top:647.30px" class="cls_002"><span class="cls_002">Slika 24. POST zahtev za dodavanje nove knjige</span></div>
<div style="position:absolute;left:511.18px;top:822.19px" class="cls_002"><span class="cls_002">28</span></div>
</div>
<div style="position:absolute;left:50%;margin-left:-298px;top:23884px;width:596px;height:843px;border-style:outset;overflow:hidden">
<div style="position:absolute;left:0px;top:0px">
<img src="4ef19dde-cb38-11e8-b59b-0cc47a792c0a_id_4ef19dde-cb38-11e8-b59b-0cc47a792c0a_files/background029.jpg" width=596 height=843></div>
<div style="position:absolute;left:72.06px;top:645.80px" class="cls_002"><span class="cls_002">Slika 25. PATCH zahtev za izmenju knjige i DELETE zahtev za brisanje knjige</span></div>
<div style="position:absolute;left:511.18px;top:822.19px" class="cls_002"><span class="cls_002">29</span></div>
</div>
<div style="position:absolute;left:50%;margin-left:-298px;top:24737px;width:596px;height:843px;border-style:outset;overflow:hidden">
<div style="position:absolute;left:0px;top:0px">
<img src="4ef19dde-cb38-11e8-b59b-0cc47a792c0a_id_4ef19dde-cb38-11e8-b59b-0cc47a792c0a_files/background030.jpg" width=596 height=843></div>
<div style="position:absolute;left:72.06px;top:91.08px" class="cls_007"><span class="cls_007">3. Frontend</span></div>
<div style="position:absolute;left:72.06px;top:139.87px" class="cls_002"><span class="cls_002">Angular 2 je JavaScript Framework za ‘’Single Page’ veb aplikacije.</span></div>
<div style="position:absolute;left:72.06px;top:154.89px" class="cls_002"><span class="cls_002">Koriste se asinhroni zahtevi, šalje se manji broj zahteva ka serveru, što kao za posledicu ima</span></div>
<div style="position:absolute;left:72.06px;top:169.90px" class="cls_002"><span class="cls_002">brži odziv UX.</span></div>
<div style="position:absolute;left:72.06px;top:199.92px" class="cls_002"><span class="cls_002">Kod se piše u TypeScript-u - nadskup JavaScript-a kompajliran u cist JavaScript.</span></div>
<div style="position:absolute;left:216.18px;top:493.42px" class="cls_002"><span class="cls_002">Slika 26. index.hbs html stranica</span></div>
<div style="position:absolute;left:72.06px;top:523.44px" class="cls_002"><span class="cls_002">index.hbs stranica je kreirana putem Jade template-a i omogućava renderovanje templejta.</span></div>
<div style="position:absolute;left:511.18px;top:822.19px" class="cls_002"><span class="cls_002">30</span></div>
</div>
<div style="position:absolute;left:50%;margin-left:-298px;top:25590px;width:596px;height:843px;border-style:outset;overflow:hidden">
<div style="position:absolute;left:0px;top:0px">
<img src="4ef19dde-cb38-11e8-b59b-0cc47a792c0a_id_4ef19dde-cb38-11e8-b59b-0cc47a792c0a_files/background031.jpg" width=596 height=843></div>
<div style="position:absolute;left:252.21px;top:714.85px" class="cls_002"><span class="cls_002">Slika 27. style.css fajl</span></div>
<div style="position:absolute;left:511.18px;top:822.20px" class="cls_002"><span class="cls_002">31</span></div>
</div>
<div style="position:absolute;left:50%;margin-left:-298px;top:26443px;width:596px;height:843px;border-style:outset;overflow:hidden">
<div style="position:absolute;left:0px;top:0px">
<img src="4ef19dde-cb38-11e8-b59b-0cc47a792c0a_id_4ef19dde-cb38-11e8-b59b-0cc47a792c0a_files/background032.jpg" width=596 height=843></div>
<div style="position:absolute;left:72.06px;top:71.57px" class="cls_002"><span class="cls_002">style.css fajl predstavlja glavni stysheet aplikacije, primenjuje se na sve komponente</span></div>
<div style="position:absolute;left:252.21px;top:571.48px" class="cls_002"><span class="cls_002">Slika 28. app.routing.ts fajl</span></div>
<div style="position:absolute;left:72.06px;top:601.51px" class="cls_002"><span class="cls_002">U app.routing.ts fajlu je kreiran Angular ruter i definisane su sve moguće putanje (rute) sa</span></div>
<div style="position:absolute;left:72.06px;top:616.52px" class="cls_002"><span class="cls_002">odgovarajućim komponentama koje je potrebno učitati.</span></div>
<div style="position:absolute;left:511.18px;top:822.20px" class="cls_002"><span class="cls_002">32</span></div>
</div>
<div style="position:absolute;left:50%;margin-left:-298px;top:27296px;width:596px;height:843px;border-style:outset;overflow:hidden">
<div style="position:absolute;left:0px;top:0px">
<img src="4ef19dde-cb38-11e8-b59b-0cc47a792c0a_id_4ef19dde-cb38-11e8-b59b-0cc47a792c0a_files/background033.jpg" width=596 height=843></div>
<div style="position:absolute;left:216.18px;top:392.84px" class="cls_002"><span class="cls_002">Slika 29. app.component.ts fajl</span></div>
<div style="position:absolute;left:72.06px;top:422.86px" class="cls_002"><span class="cls_002">app.component.ts fajl predstavlja glavni typescript fajl. U njemu definisemo servise</span></div>
<div style="position:absolute;left:72.06px;top:437.87px" class="cls_002"><span class="cls_002">BookService, PostService i CommentService kako bi bili dostupni svim ostalim</span></div>
<div style="position:absolute;left:72.06px;top:452.89px" class="cls_002"><span class="cls_002">komponentama.</span></div>
<div style="position:absolute;left:511.18px;top:822.20px" class="cls_002"><span class="cls_002">33</span></div>
</div>
<div style="position:absolute;left:50%;margin-left:-298px;top:28149px;width:596px;height:843px;border-style:outset;overflow:hidden">
<div style="position:absolute;left:0px;top:0px">
<img src="4ef19dde-cb38-11e8-b59b-0cc47a792c0a_id_4ef19dde-cb38-11e8-b59b-0cc47a792c0a_files/background034.jpg" width=596 height=843></div>
<div style="position:absolute;left:216.18px;top:738.13px" class="cls_002"><span class="cls_002">Slika 30. app.module.ts fajl</span></div>
<div style="position:absolute;left:511.18px;top:822.20px" class="cls_002"><span class="cls_002">34</span></div>
</div>
<div style="position:absolute;left:50%;margin-left:-298px;top:29002px;width:596px;height:843px;border-style:outset;overflow:hidden">
<div style="position:absolute;left:0px;top:0px">
<img src="4ef19dde-cb38-11e8-b59b-0cc47a792c0a_id_4ef19dde-cb38-11e8-b59b-0cc47a792c0a_files/background035.jpg" width=596 height=843></div>
<div style="position:absolute;left:72.06px;top:71.56px" class="cls_002"><span class="cls_002">U app.module.ts fajlu definisemo sve komponente aplikacije, module i service AuthService i</span></div>
<div style="position:absolute;left:72.06px;top:86.58px" class="cls_002"><span class="cls_002">ErrorService koji će na taj način biti dostupni na nivou cele aplikacije. Definise se root</span></div>
<div style="position:absolute;left:72.06px;top:101.59px" class="cls_002"><span class="cls_002">komponenta unutar AppModule unutar boostrap niza. Ne ucitavaju se sve komponente</span></div>
<div style="position:absolute;left:72.06px;top:116.60px" class="cls_002"><span class="cls_002">prilikom pokretanja Angular 2 aplikacije kako se ne bi narušile performanse.</span></div>
<div style="position:absolute;left:216.18px;top:472.40px" class="cls_002"><span class="cls_002">Slika 31. app.component.html fajl</span></div>
<div style="position:absolute;left:72.06px;top:502.43px" class="cls_002"><span class="cls_002">Ovaj fajl će prikazivati renderovane komponente u zavisnosti od rute. Takođe definiše</span></div>
<div style="position:absolute;left:72.06px;top:517.44px" class="cls_002"><span class="cls_002">osnovni raspored komponenti.</span></div>
<div style="position:absolute;left:511.18px;top:822.19px" class="cls_002"><span class="cls_002">35</span></div>
</div>
<div style="position:absolute;left:50%;margin-left:-298px;top:29855px;width:596px;height:843px;border-style:outset;overflow:hidden">
<div style="position:absolute;left:0px;top:0px">
<img src="4ef19dde-cb38-11e8-b59b-0cc47a792c0a_id_4ef19dde-cb38-11e8-b59b-0cc47a792c0a_files/background036.jpg" width=596 height=843></div>
<div style="position:absolute;left:72.06px;top:168.64px" class="cls_004"><span class="cls_004">3.1 Modeli</span></div>
<div style="position:absolute;left:72.06px;top:196.92px" class="cls_002"><span class="cls_002">U aplikaciji postoje 5 modela i to:</span></div>
<div style="position:absolute;left:90.08px;top:211.93px" class="cls_002"><span class="cls_002">1. book.model.ts - model koji reprezentuje knjigu</span></div>
<div style="position:absolute;left:90.08px;top:226.94px" class="cls_002"><span class="cls_002">2. user.model.ts - model koji reprezentuje korisnika</span></div>
<div style="position:absolute;left:90.08px;top:241.96px" class="cls_002"><span class="cls_002">3. post.model.ts - model koji reprezentuje objavu</span></div>
<div style="position:absolute;left:90.08px;top:256.97px" class="cls_002"><span class="cls_002">4. comment.model.ts - model koji reprezentuje komentar</span></div>
<div style="position:absolute;left:90.08px;top:271.98px" class="cls_002"><span class="cls_002">5. error.model.ts - model koji reprezentuje grešku</span></div>
<div style="position:absolute;left:252.21px;top:596.25px" class="cls_002"><span class="cls_002">Slika 32. model knjige</span></div>
<div style="position:absolute;left:511.18px;top:822.19px" class="cls_002"><span class="cls_002">36</span></div>
</div>
<div style="position:absolute;left:50%;margin-left:-298px;top:30708px;width:596px;height:843px;border-style:outset;overflow:hidden">
<div style="position:absolute;left:0px;top:0px">
<img src="4ef19dde-cb38-11e8-b59b-0cc47a792c0a_id_4ef19dde-cb38-11e8-b59b-0cc47a792c0a_files/background037.jpg" width=596 height=843></div>
<div style="position:absolute;left:252.21px;top:344.79px" class="cls_002"><span class="cls_002">Slika 33. model komentara</span></div>
<div style="position:absolute;left:252.21px;top:493.42px" class="cls_002"><span class="cls_002">Slika 34. model greške</span></div>
<div style="position:absolute;left:511.18px;top:822.19px" class="cls_002"><span class="cls_002">37</span></div>
</div>
<div style="position:absolute;left:50%;margin-left:-298px;top:31561px;width:596px;height:843px;border-style:outset;overflow:hidden">
<div style="position:absolute;left:0px;top:0px">
<img src="4ef19dde-cb38-11e8-b59b-0cc47a792c0a_id_4ef19dde-cb38-11e8-b59b-0cc47a792c0a_files/background038.jpg" width=596 height=843></div>
<div style="position:absolute;left:252.21px;top:321.52px" class="cls_002"><span class="cls_002">Slika 35. model objave</span></div>
<div style="position:absolute;left:252.21px;top:487.41px" class="cls_002"><span class="cls_002">Slika 36. model korisnika</span></div>
<div style="position:absolute;left:511.18px;top:822.19px" class="cls_002"><span class="cls_002">38</span></div>
</div>
<div style="position:absolute;left:50%;margin-left:-298px;top:32414px;width:596px;height:843px;border-style:outset;overflow:hidden">
<div style="position:absolute;left:0px;top:0px">
<img src="4ef19dde-cb38-11e8-b59b-0cc47a792c0a_id_4ef19dde-cb38-11e8-b59b-0cc47a792c0a_files/background039.jpg" width=596 height=843></div>
<div style="position:absolute;left:72.06px;top:287.99px" class="cls_004"><span class="cls_004">3.2 Servisi</span></div>
<div style="position:absolute;left:72.06px;top:316.27px" class="cls_002"><span class="cls_002">Servisi služe za centralizaciju funkcionalnosti. Smanjuje se dupliciranje koda kroz</span></div>
<div style="position:absolute;left:72.06px;top:331.28px" class="cls_002"><span class="cls_002">centralizaciju, prosleđuju se samo instance servisa specijalizovanog za određenu logiku</span></div>
<div style="position:absolute;left:72.06px;top:346.30px" class="cls_002"><span class="cls_002">unutar aplikacije. Servisi se često koriste za rukovanje podacima - centralizujemo logiku za</span></div>
<div style="position:absolute;left:72.06px;top:361.31px" class="cls_002"><span class="cls_002">rukovanje podacima kroz servis.</span></div>
<div style="position:absolute;left:72.06px;top:392.08px" class="cls_016"><span class="cls_016">3.2.1 HTTP Zahtevi</span></div>
<div style="position:absolute;left:72.06px;top:415.35px" class="cls_002"><span class="cls_002">Ne renderuje se serverski nova stranica, podaci se šalju koriz XMLHttpRequest objekat-</span></div>
<div style="position:absolute;left:72.06px;top:430.37px" class="cls_002"><span class="cls_002">AJAX zahtevi. Koriste se Observables i Observable patern. Observable služi za asinhrone</span></div>
<div style="position:absolute;left:72.06px;top:445.38px" class="cls_002"><span class="cls_002">zahteve, osluškuje različite izvore. Javlja Observer-u kada dođe do promene od interesa.</span></div>
<div style="position:absolute;left:72.06px;top:460.39px" class="cls_002"><span class="cls_002">Angular koristi observables u pozadini za zahteve - http.post kreira observable.</span></div>
<div style="position:absolute;left:72.06px;top:475.40px" class="cls_002"><span class="cls_002">subscribe na http observable - rukujemo podacima poslanim od Observable-a što je slično</span></div>
<div style="position:absolute;left:72.06px;top:490.42px" class="cls_002"><span class="cls_002">kao callbacks ili promises.</span></div>
<div style="position:absolute;left:72.06px;top:535.45px" class="cls_002"><span class="cls_002">Observable HTTP zahtevi - RxJS Svi zahtevi ka backend-u, šalju token kao query</span></div>
<div style="position:absolute;left:72.06px;top:550.47px" class="cls_002"><span class="cls_002">parametar.</span></div>
<div style="position:absolute;left:72.06px;top:595.50px" class="cls_002"><span class="cls_002">U aplikaciji postoje pet servisa i to:</span></div>
<div style="position:absolute;left:90.08px;top:610.52px" class="cls_002"><span class="cls_002">1. auth.service.ts - servis za rukovanje autentifikacijom korisnika</span></div>
<div style="position:absolute;left:90.08px;top:625.53px" class="cls_002"><span class="cls_002">2. post.service.ts - servis za rukovanje objavama</span></div>
<div style="position:absolute;left:90.08px;top:640.54px" class="cls_002"><span class="cls_002">3. comment.service.ts - servis za rukovanje komentarima</span></div>
<div style="position:absolute;left:90.08px;top:655.55px" class="cls_002"><span class="cls_002">4. book.service.ts - servis za rukovanje knjigama</span></div>
<div style="position:absolute;left:90.08px;top:670.57px" class="cls_002"><span class="cls_002">5. error.service.ts - zaseban servis i komponenta za rukovanje greskama na nivou</span></div>
<div style="position:absolute;left:108.09px;top:685.58px" class="cls_002"><span class="cls_002">aplikacije</span></div>
<div style="position:absolute;left:72.06px;top:715.61px" class="cls_002"><span class="cls_002">Svaki servis poseduje odgovarajuće operacije koje su već navedene prilikom definisanja ruta</span></div>
<div style="position:absolute;left:72.06px;top:730.62px" class="cls_002"><span class="cls_002">za korisnika, knjigu, objavu i komentar.</span></div>
<div style="position:absolute;left:511.18px;top:822.19px" class="cls_002"><span class="cls_002">39</span></div>
</div>
<div style="position:absolute;left:50%;margin-left:-298px;top:33267px;width:596px;height:843px;border-style:outset;overflow:hidden">
<div style="position:absolute;left:0px;top:0px">
<img src="4ef19dde-cb38-11e8-b59b-0cc47a792c0a_id_4ef19dde-cb38-11e8-b59b-0cc47a792c0a_files/background040.jpg" width=596 height=843></div>
<div style="position:absolute;left:216.18px;top:629.28px" class="cls_002"><span class="cls_002">Slika 37. servis korisnika</span></div>
<div style="position:absolute;left:72.06px;top:659.31px" class="cls_002"><span class="cls_002">Metoda logout() vrši odjavljivanje korisnika brisanje njegovih informacija(tokena i id) iz</span></div>
<div style="position:absolute;left:72.06px;top:674.32px" class="cls_002"><span class="cls_002">localstorage-a.</span></div>
<div style="position:absolute;left:72.06px;top:704.35px" class="cls_002"><span class="cls_002">Metoda isLoggedIn() vrši proveru da li je korisnik trenutno ulogovan proveravajući da li je</span></div>
<div style="position:absolute;left:72.06px;top:719.36px" class="cls_002"><span class="cls_002">token različit od null.</span></div>
<div style="position:absolute;left:511.18px;top:822.20px" class="cls_002"><span class="cls_002">40</span></div>
</div>
<div style="position:absolute;left:50%;margin-left:-298px;top:34120px;width:596px;height:843px;border-style:outset;overflow:hidden">
<div style="position:absolute;left:0px;top:0px">
<img src="4ef19dde-cb38-11e8-b59b-0cc47a792c0a_id_4ef19dde-cb38-11e8-b59b-0cc47a792c0a_files/background041.jpg" width=596 height=843></div>
<div style="position:absolute;left:72.06px;top:71.56px" class="cls_002"><span class="cls_002">Metoda register() vrši registrovanje korisnika, metoda login prijavljivanje, dok metoda</span></div>
<div style="position:absolute;left:72.06px;top:86.58px" class="cls_002"><span class="cls_002">getUser vraća specifičnog korisnika.</span></div>
<div style="position:absolute;left:252.21px;top:386.83px" class="cls_002"><span class="cls_002">Slika 38. servis korisnika</span></div>
<div style="position:absolute;left:72.06px;top:416.85px" class="cls_002"><span class="cls_002">Metoda getUsers() služi za prikaz svih korisnika administratoru.</span></div>
<div style="position:absolute;left:72.06px;top:446.88px" class="cls_002"><span class="cls_002">Metoda changeProflePicture() služi za promenu profilne slike.</span></div>
<div style="position:absolute;left:511.18px;top:822.19px" class="cls_002"><span class="cls_002">41</span></div>
</div>
<div style="position:absolute;left:50%;margin-left:-298px;top:34973px;width:596px;height:843px;border-style:outset;overflow:hidden">
<div style="position:absolute;left:0px;top:0px">
<img src="4ef19dde-cb38-11e8-b59b-0cc47a792c0a_id_4ef19dde-cb38-11e8-b59b-0cc47a792c0a_files/background042.jpg" width=596 height=843></div>
<div style="position:absolute;left:216.18px;top:489.66px" class="cls_002"><span class="cls_002">Slika 39. servis knjiga</span></div>
<div style="position:absolute;left:72.06px;top:519.69px" class="cls_002"><span class="cls_002">Metoda addBook() služi za dodavanje nove knjige.</span></div>
<div style="position:absolute;left:511.18px;top:822.19px" class="cls_002"><span class="cls_002">42</span></div>
</div>
<div style="position:absolute;left:50%;margin-left:-298px;top:35826px;width:596px;height:843px;border-style:outset;overflow:hidden">
<div style="position:absolute;left:0px;top:0px">
<img src="4ef19dde-cb38-11e8-b59b-0cc47a792c0a_id_4ef19dde-cb38-11e8-b59b-0cc47a792c0a_files/background043.jpg" width=596 height=843></div>
<div style="position:absolute;left:252.21px;top:578.24px" class="cls_002"><span class="cls_002">Slika 40. servis knjiga</span></div>
<div style="position:absolute;left:72.06px;top:608.26px" class="cls_002"><span class="cls_002">Metoda getBooks() služi za prikaz svih korisnikovih knjiga.</span></div>
<div style="position:absolute;left:511.18px;top:822.19px" class="cls_002"><span class="cls_002">43</span></div>
</div>
<div style="position:absolute;left:50%;margin-left:-298px;top:36679px;width:596px;height:843px;border-style:outset;overflow:hidden">
<div style="position:absolute;left:0px;top:0px">
<img src="4ef19dde-cb38-11e8-b59b-0cc47a792c0a_id_4ef19dde-cb38-11e8-b59b-0cc47a792c0a_files/background044.jpg" width=596 height=843></div>
<div style="position:absolute;left:252.21px;top:575.24px" class="cls_002"><span class="cls_002">Slika 41. servis knjiga</span></div>
<div style="position:absolute;left:72.06px;top:605.26px" class="cls_002"><span class="cls_002">Metoda getBooksHome() služi za prikaz svih knjiga svih korinika na početno strani.</span></div>
<div style="position:absolute;left:511.18px;top:822.19px" class="cls_002"><span class="cls_002">44</span></div>
</div>
<div style="position:absolute;left:50%;margin-left:-298px;top:37532px;width:596px;height:843px;border-style:outset;overflow:hidden">
<div style="position:absolute;left:0px;top:0px">
<img src="4ef19dde-cb38-11e8-b59b-0cc47a792c0a_id_4ef19dde-cb38-11e8-b59b-0cc47a792c0a_files/background045.jpg" width=596 height=843></div>
<div style="position:absolute;left:252.21px;top:620.27px" class="cls_002"><span class="cls_002">Slika 42. servis knjiga</span></div>
<div style="position:absolute;left:72.06px;top:650.30px" class="cls_002"><span class="cls_002">Metoda getBook() služi za prikaz određene knjige.</span></div>
<div style="position:absolute;left:72.06px;top:680.32px" class="cls_002"><span class="cls_002">Metoda updateBook() služi za ažuriranje knjige od strane korisnika. Korisnik može da ažurira</span></div>
<div style="position:absolute;left:72.06px;top:695.34px" class="cls_002"><span class="cls_002">samo svoje knjige ukoliko je registrovan.</span></div>
<div style="position:absolute;left:72.06px;top:725.36px" class="cls_002"><span class="cls_002">Metoda updateBookAdmin() služi za ažuriranje knjige od strane admina. Admin može da</span></div>
<div style="position:absolute;left:72.06px;top:740.37px" class="cls_002"><span class="cls_002">ažurira sve knjige.</span></div>
<div style="position:absolute;left:511.18px;top:822.19px" class="cls_002"><span class="cls_002">45</span></div>
</div>
<div style="position:absolute;left:50%;margin-left:-298px;top:38385px;width:596px;height:843px;border-style:outset;overflow:hidden">
<div style="position:absolute;left:0px;top:0px">
<img src="4ef19dde-cb38-11e8-b59b-0cc47a792c0a_id_4ef19dde-cb38-11e8-b59b-0cc47a792c0a_files/background046.jpg" width=596 height=843></div>
<div style="position:absolute;left:252.21px;top:554.22px" class="cls_002"><span class="cls_002">Slika 43. servis knjiga</span></div>
<div style="position:absolute;left:72.06px;top:584.24px" class="cls_002"><span class="cls_002">Metoda updateSold() služi za ažuriranje knjige prilikom njene kupovine od strane nekog</span></div>
<div style="position:absolute;left:72.06px;top:599.26px" class="cls_002"><span class="cls_002">korisnika.</span></div>
<div style="position:absolute;left:72.06px;top:629.28px" class="cls_002"><span class="cls_002">Metoda deleteBook() služi za brisanje knjige od strane nekog korisnika. Svaki korisnik može</span></div>
<div style="position:absolute;left:72.06px;top:644.29px" class="cls_002"><span class="cls_002">da briše jedino svoje knjige (knjige koje je on postavio).</span></div>
<div style="position:absolute;left:72.06px;top:674.32px" class="cls_002"><span class="cls_002">Metoda deleteBookAdmin() služi za brisanje knjige od strane administratora. Administrator</span></div>
<div style="position:absolute;left:72.06px;top:689.33px" class="cls_002"><span class="cls_002">može da briše knjige svih korisnika.</span></div>
<div style="position:absolute;left:511.18px;top:822.19px" class="cls_002"><span class="cls_002">46</span></div>
</div>
<div style="position:absolute;left:50%;margin-left:-298px;top:39238px;width:596px;height:843px;border-style:outset;overflow:hidden">
<div style="position:absolute;left:0px;top:0px">
<img src="4ef19dde-cb38-11e8-b59b-0cc47a792c0a_id_4ef19dde-cb38-11e8-b59b-0cc47a792c0a_files/background047.jpg" width=596 height=843></div>
<div style="position:absolute;left:252.21px;top:554.22px" class="cls_002"><span class="cls_002">44. servis komentara</span></div>
<div style="position:absolute;left:72.06px;top:584.24px" class="cls_002"><span class="cls_002">Metoda addComment() služi za dodavanje komentara na neku knjigu, o knjizi ili korisniku</span></div>
<div style="position:absolute;left:72.06px;top:599.26px" class="cls_002"><span class="cls_002">koji ju je postavio. Samo registrovani korisnici mogu komentarisati.</span></div>
<div style="position:absolute;left:511.18px;top:822.19px" class="cls_002"><span class="cls_002">47</span></div>
</div>
<div style="position:absolute;left:50%;margin-left:-298px;top:40091px;width:596px;height:843px;border-style:outset;overflow:hidden">
<div style="position:absolute;left:0px;top:0px">
<img src="4ef19dde-cb38-11e8-b59b-0cc47a792c0a_id_4ef19dde-cb38-11e8-b59b-0cc47a792c0a_files/background048.jpg" width=596 height=843></div>
<div style="position:absolute;left:252.21px;top:509.18px" class="cls_002"><span class="cls_002">Slika 45. servis komentara</span></div>
<div style="position:absolute;left:72.06px;top:539.21px" class="cls_002"><span class="cls_002">Metoda getComments() služi za prikaz svih komentara neke knjige.</span></div>
<div style="position:absolute;left:511.18px;top:822.19px" class="cls_002"><span class="cls_002">48</span></div>
</div>
<div style="position:absolute;left:50%;margin-left:-298px;top:40944px;width:596px;height:843px;border-style:outset;overflow:hidden">
<div style="position:absolute;left:0px;top:0px">
<img src="4ef19dde-cb38-11e8-b59b-0cc47a792c0a_id_4ef19dde-cb38-11e8-b59b-0cc47a792c0a_files/background049.jpg" width=596 height=843></div>
<div style="position:absolute;left:180.15px;top:394.34px" class="cls_002"><span class="cls_002">Slika 46. servis za rukovanje greškama</span></div>
<div style="position:absolute;left:511.18px;top:822.19px" class="cls_002"><span class="cls_002">49</span></div>
</div>
<div style="position:absolute;left:50%;margin-left:-298px;top:41797px;width:596px;height:843px;border-style:outset;overflow:hidden">
<div style="position:absolute;left:0px;top:0px">
<img src="4ef19dde-cb38-11e8-b59b-0cc47a792c0a_id_4ef19dde-cb38-11e8-b59b-0cc47a792c0a_files/background050.jpg" width=596 height=843></div>
<div style="position:absolute;left:288.24px;top:71.56px" class="cls_002"><span class="cls_002">dodavanje novog Slika 47. Slika 47. servis Slika</span></div>
<div style="position:absolute;left:252.21px;top:469.40px" class="cls_002"><span class="cls_002">Slika 47. servis objava</span></div>
<div style="position:absolute;left:72.06px;top:499.42px" class="cls_002"><span class="cls_002">Metoda addPost() služi za objavljivanje novih postova na blogu. Samo registrovani korisnici</span></div>
<div style="position:absolute;left:72.06px;top:514.44px" class="cls_002"><span class="cls_002">mogu objavljivati na blogu.</span></div>
<div style="position:absolute;left:511.18px;top:822.19px" class="cls_002"><span class="cls_002">50</span></div>
</div>
<div style="position:absolute;left:50%;margin-left:-298px;top:42650px;width:596px;height:843px;border-style:outset;overflow:hidden">
<div style="position:absolute;left:0px;top:0px">
<img src="4ef19dde-cb38-11e8-b59b-0cc47a792c0a_id_4ef19dde-cb38-11e8-b59b-0cc47a792c0a_files/background051.jpg" width=596 height=843></div>
<div style="position:absolute;left:252.21px;top:635.29px" class="cls_002"><span class="cls_002">Slika 48. servis objava</span></div>
<div style="position:absolute;left:72.06px;top:665.31px" class="cls_002"><span class="cls_002">Metoda getPosts() služi za prika svih objava na forumu.</span></div>
<div style="position:absolute;left:72.06px;top:695.34px" class="cls_002"><span class="cls_002">Metoda getPost() služi za prikaz jedne određene objave.</span></div>
<div style="position:absolute;left:72.06px;top:725.36px" class="cls_002"><span class="cls_002">Metoda deletePost() služi za brisanje postova. Samo administrator može brisati postove (i to</span></div>
<div style="position:absolute;left:72.06px;top:740.38px" class="cls_002"><span class="cls_002">sve).</span></div>
<div style="position:absolute;left:511.18px;top:822.19px" class="cls_002"><span class="cls_002">51</span></div>
</div>
<div style="position:absolute;left:50%;margin-left:-298px;top:43503px;width:596px;height:843px;border-style:outset;overflow:hidden">
<div style="position:absolute;left:0px;top:0px">
<img src="4ef19dde-cb38-11e8-b59b-0cc47a792c0a_id_4ef19dde-cb38-11e8-b59b-0cc47a792c0a_files/background052.jpg" width=596 height=843></div>
<div style="position:absolute;left:252.21px;top:311.02px" class="cls_002"><span class="cls_002">Slika 49. servis objava</span></div>
<div style="position:absolute;left:72.06px;top:341.04px" class="cls_002"><span class="cls_002">Metoda updatePost() služi za izmenu objava na forumu. Samo administrator sistema može</span></div>
<div style="position:absolute;left:72.06px;top:356.05px" class="cls_002"><span class="cls_002">vršiti izmenu objava(i to svih) ukoliko uoči neki neprikladan sadržaj.</span></div>
<div style="position:absolute;left:511.18px;top:822.19px" class="cls_002"><span class="cls_002">52</span></div>
</div>
<div style="position:absolute;left:50%;margin-left:-298px;top:44356px;width:596px;height:843px;border-style:outset;overflow:hidden">
<div style="position:absolute;left:0px;top:0px">
<img src="4ef19dde-cb38-11e8-b59b-0cc47a792c0a_id_4ef19dde-cb38-11e8-b59b-0cc47a792c0a_files/background053.jpg" width=596 height=843></div>
<div style="position:absolute;left:72.06px;top:119.10px" class="cls_004"><span class="cls_004">3.3 Komponente</span></div>
<div style="position:absolute;left:72.06px;top:162.39px" class="cls_002"><span class="cls_002">Aplikacija se sastoji od ukupno 23 komponente i te komponente su sledeće:</span></div>
<div style="position:absolute;left:90.08px;top:192.42px" class="cls_002"><span class="cls_002">●</span></div>
<div style="position:absolute;left:108.09px;top:192.42px" class="cls_002"><span class="cls_002">about - služi za prikaz stranice sa nekim osnovnim informacijama o sajtu</span></div>
<div style="position:absolute;left:90.08px;top:207.43px" class="cls_002"><span class="cls_002">●</span></div>
<div style="position:absolute;left:108.09px;top:207.43px" class="cls_002"><span class="cls_002">add-book - reprezentuje formu za dodavanje nove knjige</span></div>
<div style="position:absolute;left:90.08px;top:222.44px" class="cls_002"><span class="cls_002">●</span></div>
<div style="position:absolute;left:108.09px;top:222.44px" class="cls_002"><span class="cls_002">add-comment - reprezentuje formu za dodavanje novog komentara</span></div>
<div style="position:absolute;left:90.08px;top:237.45px" class="cls_002"><span class="cls_002">●</span></div>
<div style="position:absolute;left:108.09px;top:237.45px" class="cls_002"><span class="cls_002">blog - služi za prikaz stranice za blog</span></div>
<div style="position:absolute;left:90.08px;top:252.47px" class="cls_002"><span class="cls_002">●</span></div>
<div style="position:absolute;left:108.09px;top:252.47px" class="cls_002"><span class="cls_002">book - gradivna komponenta koja reprezentuje knjigu</span></div>
<div style="position:absolute;left:90.08px;top:267.48px" class="cls_002"><span class="cls_002">●</span></div>
<div style="position:absolute;left:108.09px;top:267.48px" class="cls_002"><span class="cls_002">book-details - služi za prikaz stranice sa detaljima o odabranom knjizi</span></div>
<div style="position:absolute;left:90.08px;top:282.49px" class="cls_002"><span class="cls_002">●</span></div>
<div style="position:absolute;left:108.09px;top:282.49px" class="cls_002"><span class="cls_002">change-profile-picture - služi za prikaz stranice koja omogućuje promenu profilne</span></div>
<div style="position:absolute;left:108.09px;top:297.50px" class="cls_002"><span class="cls_002">slike</span></div>
<div style="position:absolute;left:90.08px;top:312.52px" class="cls_002"><span class="cls_002">●</span></div>
<div style="position:absolute;left:108.09px;top:312.52px" class="cls_002"><span class="cls_002">comment - gradivna komponenta koja reprezentuje komentar</span></div>
<div style="position:absolute;left:90.08px;top:327.53px" class="cls_002"><span class="cls_002">●</span></div>
<div style="position:absolute;left:108.09px;top:327.53px" class="cls_002"><span class="cls_002">error - komponenta koja je namenjena za obradu grešaka</span></div>
<div style="position:absolute;left:90.08px;top:342.54px" class="cls_002"><span class="cls_002">●</span></div>
<div style="position:absolute;left:108.09px;top:342.54px" class="cls_002"><span class="cls_002">header - služi za prikaz zaglavlja stranice</span></div>
<div style="position:absolute;left:90.08px;top:357.56px" class="cls_002"><span class="cls_002">●</span></div>
<div style="position:absolute;left:108.09px;top:357.56px" class="cls_002"><span class="cls_002">home - služi za prikaz naslovne strana sajta</span></div>
<div style="position:absolute;left:90.08px;top:372.57px" class="cls_002"><span class="cls_002">●</span></div>
<div style="position:absolute;left:108.09px;top:372.57px" class="cls_002"><span class="cls_002">login - reprezentuje formu za logovanje</span></div>
<div style="position:absolute;left:90.08px;top:387.58px" class="cls_002"><span class="cls_002">●</span></div>
<div style="position:absolute;left:108.09px;top:387.58px" class="cls_002"><span class="cls_002">logout - služi za odjavljivanje sa sajta</span></div>
<div style="position:absolute;left:90.08px;top:402.59px" class="cls_002"><span class="cls_002">●</span></div>
<div style="position:absolute;left:108.09px;top:402.59px" class="cls_002"><span class="cls_002">page-not-found - komponenta koja se prikazuje u slučaju pogrešno URL-a</span></div>
<div style="position:absolute;left:90.08px;top:417.61px" class="cls_002"><span class="cls_002">●</span></div>
<div style="position:absolute;left:108.09px;top:417.61px" class="cls_002"><span class="cls_002">post - gradivna komponenta koja reprezentuje objavu</span></div>
<div style="position:absolute;left:90.08px;top:432.62px" class="cls_002"><span class="cls_002">●</span></div>
<div style="position:absolute;left:108.09px;top:432.62px" class="cls_002"><span class="cls_002">post-details - služi za prikaz pojedinačne objave</span></div>
<div style="position:absolute;left:90.08px;top:447.63px" class="cls_002"><span class="cls_002">●</span></div>
<div style="position:absolute;left:108.09px;top:447.63px" class="cls_002"><span class="cls_002">profile - služi za prikaz profilne stanice registrovanog korisnika</span></div>
<div style="position:absolute;left:90.08px;top:462.64px" class="cls_002"><span class="cls_002">●</span></div>
<div style="position:absolute;left:108.09px;top:462.64px" class="cls_002"><span class="cls_002">publish - služi za objavljivanje novih postova</span></div>
<div style="position:absolute;left:90.08px;top:477.66px" class="cls_002"><span class="cls_002">●</span></div>
<div style="position:absolute;left:108.09px;top:477.66px" class="cls_002"><span class="cls_002">register - reprezentuje formu za registraciju</span></div>
<div style="position:absolute;left:90.08px;top:492.67px" class="cls_002"><span class="cls_002">●</span></div>
<div style="position:absolute;left:108.09px;top:492.67px" class="cls_002"><span class="cls_002">showinfo - služi za prikaz informacija o kupcu</span></div>
<div style="position:absolute;left:90.08px;top:507.68px" class="cls_002"><span class="cls_002">●</span></div>
<div style="position:absolute;left:108.09px;top:507.68px" class="cls_002"><span class="cls_002">update-book - reprezentuje formu za ažuriranje knjige</span></div>
<div style="position:absolute;left:90.08px;top:522.69px" class="cls_002"><span class="cls_002">●</span></div>
<div style="position:absolute;left:108.09px;top:522.69px" class="cls_002"><span class="cls_002">update-post - reprezentuje formu za ažuriranje posta</span></div>
<div style="position:absolute;left:90.08px;top:537.71px" class="cls_002"><span class="cls_002">●</span></div>
<div style="position:absolute;left:108.09px;top:537.71px" class="cls_002"><span class="cls_002">users - služi za prikaz svih registrovanih korisnika (ova mogućnost je dostupna samo</span></div>
<div style="position:absolute;left:108.09px;top:552.72px" class="cls_002"><span class="cls_002">adminu)</span></div>
<div style="position:absolute;left:72.06px;top:582.74px" class="cls_002"><span class="cls_002">U nastavku je dat prikaz svih navedenih komponenti koje se sastoje iz tri dela - htm, css i ts</span></div>
<div style="position:absolute;left:72.06px;top:597.76px" class="cls_002"><span class="cls_002">fajl.</span></div>
<div style="position:absolute;left:511.18px;top:822.19px" class="cls_002"><span class="cls_002">53</span></div>
</div>
<div style="position:absolute;left:50%;margin-left:-298px;top:45209px;width:596px;height:843px;border-style:outset;overflow:hidden">
<div style="position:absolute;left:0px;top:0px">
<img src="4ef19dde-cb38-11e8-b59b-0cc47a792c0a_id_4ef19dde-cb38-11e8-b59b-0cc47a792c0a_files/background054.jpg" width=596 height=843></div>
<div style="position:absolute;left:216.18px;top:470.90px" class="cls_002"><span class="cls_002">Slika 50. about.component.hmtl</span></div>
<div style="position:absolute;left:511.18px;top:822.20px" class="cls_002"><span class="cls_002">54</span></div>
</div>
<div style="position:absolute;left:50%;margin-left:-298px;top:46062px;width:596px;height:843px;border-style:outset;overflow:hidden">
<div style="position:absolute;left:0px;top:0px">
<img src="4ef19dde-cb38-11e8-b59b-0cc47a792c0a_id_4ef19dde-cb38-11e8-b59b-0cc47a792c0a_files/background055.jpg" width=596 height=843></div>
<div style="position:absolute;left:252.21px;top:353.05px" class="cls_002"><span class="cls_002">Slika 51. about.component.ts</span></div>
<div style="position:absolute;left:216.18px;top:726.86px" class="cls_002"><span class="cls_002">Slika 52. add-book.component.html</span></div>
<div style="position:absolute;left:511.18px;top:822.19px" class="cls_002"><span class="cls_002">55</span></div>
</div>
<div style="position:absolute;left:50%;margin-left:-298px;top:46915px;width:596px;height:843px;border-style:outset;overflow:hidden">
<div style="position:absolute;left:0px;top:0px">
<img src="4ef19dde-cb38-11e8-b59b-0cc47a792c0a_id_4ef19dde-cb38-11e8-b59b-0cc47a792c0a_files/background056.jpg" width=596 height=843></div>
<div style="position:absolute;left:252.21px;top:534.70px" class="cls_002"><span class="cls_002">Slika 53. add-book.component.ts</span></div>
<div style="position:absolute;left:511.18px;top:822.19px" class="cls_002"><span class="cls_002">56</span></div>
</div>
<div style="position:absolute;left:50%;margin-left:-298px;top:47768px;width:596px;height:843px;border-style:outset;overflow:hidden">
<div style="position:absolute;left:0px;top:0px">
<img src="4ef19dde-cb38-11e8-b59b-0cc47a792c0a_id_4ef19dde-cb38-11e8-b59b-0cc47a792c0a_files/background057.jpg" width=596 height=843></div>
<div style="position:absolute;left:216.18px;top:320.77px" class="cls_002"><span class="cls_002">Slika 54. add-comment.component.html</span></div>
<div style="position:absolute;left:511.18px;top:822.19px" class="cls_002"><span class="cls_002">57</span></div>
</div>
<div style="position:absolute;left:50%;margin-left:-298px;top:48621px;width:596px;height:843px;border-style:outset;overflow:hidden">
<div style="position:absolute;left:0px;top:0px">
<img src="4ef19dde-cb38-11e8-b59b-0cc47a792c0a_id_4ef19dde-cb38-11e8-b59b-0cc47a792c0a_files/background058.jpg" width=596 height=843></div>
<div style="position:absolute;left:216.18px;top:715.61px" class="cls_002"><span class="cls_002">Slika 55. add-comment.component.ts</span></div>
<div style="position:absolute;left:511.18px;top:822.19px" class="cls_002"><span class="cls_002">58</span></div>
</div>
<div style="position:absolute;left:50%;margin-left:-298px;top:49474px;width:596px;height:843px;border-style:outset;overflow:hidden">
<div style="position:absolute;left:0px;top:0px">
<img src="4ef19dde-cb38-11e8-b59b-0cc47a792c0a_id_4ef19dde-cb38-11e8-b59b-0cc47a792c0a_files/background059.jpg" width=596 height=843></div>
<div style="position:absolute;left:216.18px;top:362.81px" class="cls_002"><span class="cls_002">Slika 56.blog.component.html</span></div>
<div style="position:absolute;left:511.18px;top:822.19px" class="cls_002"><span class="cls_002">59</span></div>
</div>
<div style="position:absolute;left:50%;margin-left:-298px;top:50327px;width:596px;height:843px;border-style:outset;overflow:hidden">
<div style="position:absolute;left:0px;top:0px">
<img src="4ef19dde-cb38-11e8-b59b-0cc47a792c0a_id_4ef19dde-cb38-11e8-b59b-0cc47a792c0a_files/background060.jpg" width=596 height=843></div>
<div style="position:absolute;left:216.18px;top:478.41px" class="cls_002"><span class="cls_002">Slika 58. blog.component.ts</span></div>
<div style="position:absolute;left:216.18px;top:678.07px" class="cls_002"><span class="cls_002">Slika 59. book.component.html</span></div>
<div style="position:absolute;left:511.18px;top:822.20px" class="cls_002"><span class="cls_002">60</span></div>
</div>
<div style="position:absolute;left:50%;margin-left:-298px;top:51180px;width:596px;height:843px;border-style:outset;overflow:hidden">
<div style="position:absolute;left:0px;top:0px">
<img src="4ef19dde-cb38-11e8-b59b-0cc47a792c0a_id_4ef19dde-cb38-11e8-b59b-0cc47a792c0a_files/background061.jpg" width=596 height=843></div>
<div style="position:absolute;left:252.21px;top:479.91px" class="cls_002"><span class="cls_002">Slika 60. book.component.ts</span></div>
<div style="position:absolute;left:511.18px;top:822.20px" class="cls_002"><span class="cls_002">61</span></div>
</div>
<div style="position:absolute;left:50%;margin-left:-298px;top:52033px;width:596px;height:843px;border-style:outset;overflow:hidden">
<div style="position:absolute;left:0px;top:0px">
<img src="4ef19dde-cb38-11e8-b59b-0cc47a792c0a_id_4ef19dde-cb38-11e8-b59b-0cc47a792c0a_files/background062.jpg" width=596 height=843></div>
<div style="position:absolute;left:216.18px;top:409.35px" class="cls_002"><span class="cls_002">Slika 61. book-details.component.html</span></div>
<div style="position:absolute;left:511.18px;top:822.20px" class="cls_002"><span class="cls_002">62</span></div>
</div>
<div style="position:absolute;left:50%;margin-left:-298px;top:52886px;width:596px;height:843px;border-style:outset;overflow:hidden">
<div style="position:absolute;left:0px;top:0px">
<img src="4ef19dde-cb38-11e8-b59b-0cc47a792c0a_id_4ef19dde-cb38-11e8-b59b-0cc47a792c0a_files/background063.jpg" width=596 height=843></div>
<div style="position:absolute;left:511.18px;top:822.20px" class="cls_002"><span class="cls_002">63</span></div>
</div>
<div style="position:absolute;left:50%;margin-left:-298px;top:53739px;width:596px;height:843px;border-style:outset;overflow:hidden">
<div style="position:absolute;left:0px;top:0px">
<img src="4ef19dde-cb38-11e8-b59b-0cc47a792c0a_id_4ef19dde-cb38-11e8-b59b-0cc47a792c0a_files/background064.jpg" width=596 height=843></div>
<div style="position:absolute;left:216.18px;top:400.34px" class="cls_002"><span class="cls_002">Slika 62. book-details.component.ts</span></div>
<div style="position:absolute;left:180.15px;top:532.45px" class="cls_002"><span class="cls_002">Slika 63. change-profile-picture.component.html</span></div>
<div style="position:absolute;left:511.18px;top:822.20px" class="cls_002"><span class="cls_002">64</span></div>
</div>
<div style="position:absolute;left:50%;margin-left:-298px;top:54592px;width:596px;height:843px;border-style:outset;overflow:hidden">
<div style="position:absolute;left:0px;top:0px">
<img src="4ef19dde-cb38-11e8-b59b-0cc47a792c0a_id_4ef19dde-cb38-11e8-b59b-0cc47a792c0a_files/background065.jpg" width=596 height=843></div>
<div style="position:absolute;left:180.15px;top:446.88px" class="cls_002"><span class="cls_002">Slika 64.change-profile-picture.component.ts</span></div>
<div style="position:absolute;left:216.18px;top:595.51px" class="cls_002"><span class="cls_002">Slika 65. comment.component.html</span></div>
<div style="position:absolute;left:511.18px;top:822.20px" class="cls_002"><span class="cls_002">65</span></div>
</div>
<div style="position:absolute;left:50%;margin-left:-298px;top:55445px;width:596px;height:843px;border-style:outset;overflow:hidden">
<div style="position:absolute;left:0px;top:0px">
<img src="4ef19dde-cb38-11e8-b59b-0cc47a792c0a_id_4ef19dde-cb38-11e8-b59b-0cc47a792c0a_files/background066.jpg" width=596 height=843></div>
<div style="position:absolute;left:216.18px;top:365.81px" class="cls_002"><span class="cls_002">Slika 66. comment.component.ts</span></div>
<div style="position:absolute;left:252.21px;top:587.25px" class="cls_002"><span class="cls_002">Slika 67. error.component.html</span></div>
<div style="position:absolute;left:511.18px;top:822.20px" class="cls_002"><span class="cls_002">66</span></div>
</div>
<div style="position:absolute;left:50%;margin-left:-298px;top:56298px;width:596px;height:843px;border-style:outset;overflow:hidden">
<div style="position:absolute;left:0px;top:0px">
<img src="4ef19dde-cb38-11e8-b59b-0cc47a792c0a_id_4ef19dde-cb38-11e8-b59b-0cc47a792c0a_files/background067.jpg" width=596 height=843></div>
<div style="position:absolute;left:252.21px;top:547.47px" class="cls_002"><span class="cls_002">Slika 68. error.component.ts</span></div>
<div style="position:absolute;left:511.18px;top:822.20px" class="cls_002"><span class="cls_002">67</span></div>
</div>
<div style="position:absolute;left:50%;margin-left:-298px;top:57151px;width:596px;height:843px;border-style:outset;overflow:hidden">
<div style="position:absolute;left:0px;top:0px">
<img src="4ef19dde-cb38-11e8-b59b-0cc47a792c0a_id_4ef19dde-cb38-11e8-b59b-0cc47a792c0a_files/background068.jpg" width=596 height=843></div>
<div style="position:absolute;left:252.21px;top:299.75px" class="cls_002"><span class="cls_002">Slika 69. header.component.html</span></div>
<div style="position:absolute;left:511.18px;top:822.19px" class="cls_002"><span class="cls_002">68</span></div>
</div>
<div style="position:absolute;left:50%;margin-left:-298px;top:58004px;width:596px;height:843px;border-style:outset;overflow:hidden">
<div style="position:absolute;left:0px;top:0px">
<img src="4ef19dde-cb38-11e8-b59b-0cc47a792c0a_id_4ef19dde-cb38-11e8-b59b-0cc47a792c0a_files/background069.jpg" width=596 height=843></div>
<div style="position:absolute;left:252.21px;top:555.72px" class="cls_002"><span class="cls_002">Slika 70. header.component.ts</span></div>
<div style="position:absolute;left:511.18px;top:822.19px" class="cls_002"><span class="cls_002">69</span></div>
</div>
<div style="position:absolute;left:50%;margin-left:-298px;top:58857px;width:596px;height:843px;border-style:outset;overflow:hidden">
<div style="position:absolute;left:0px;top:0px">
<img src="4ef19dde-cb38-11e8-b59b-0cc47a792c0a_id_4ef19dde-cb38-11e8-b59b-0cc47a792c0a_files/background070.jpg" width=596 height=843></div>
<div style="position:absolute;left:252.21px;top:305.76px" class="cls_002"><span class="cls_002">Slika 71. home.component.html</span></div>
<div style="position:absolute;left:511.18px;top:822.19px" class="cls_002"><span class="cls_002">70</span></div>
</div>
<div style="position:absolute;left:50%;margin-left:-298px;top:59710px;width:596px;height:843px;border-style:outset;overflow:hidden">
<div style="position:absolute;left:0px;top:0px">
<img src="4ef19dde-cb38-11e8-b59b-0cc47a792c0a_id_4ef19dde-cb38-11e8-b59b-0cc47a792c0a_files/background071.jpg" width=596 height=843></div>
<div style="position:absolute;left:252.21px;top:71.56px" class="cls_002"><span class="cls_002">Slika 72. home.component.ts</span></div>
<div style="position:absolute;left:252.21px;top:308.01px" class="cls_002"><span class="cls_002">Slika 73. login.component.html</span></div>
<div style="position:absolute;left:511.18px;top:822.19px" class="cls_002"><span class="cls_002">71</span></div>
</div>
<div style="position:absolute;left:50%;margin-left:-298px;top:60563px;width:596px;height:843px;border-style:outset;overflow:hidden">
<div style="position:absolute;left:0px;top:0px">
<img src="4ef19dde-cb38-11e8-b59b-0cc47a792c0a_id_4ef19dde-cb38-11e8-b59b-0cc47a792c0a_files/background072.jpg" width=596 height=843></div>
<div style="position:absolute;left:252.21px;top:494.17px" class="cls_002"><span class="cls_002">Slika 74. login.component.ts</span></div>
<div style="position:absolute;left:288.24px;top:600.01px" class="cls_002"><span class="cls_002">Slika 75. logout.component.html</span></div>
<div style="position:absolute;left:511.18px;top:822.19px" class="cls_002"><span class="cls_002">72</span></div>
</div>
<div style="position:absolute;left:50%;margin-left:-298px;top:61416px;width:596px;height:843px;border-style:outset;overflow:hidden">
<div style="position:absolute;left:0px;top:0px">
<img src="4ef19dde-cb38-11e8-b59b-0cc47a792c0a_id_4ef19dde-cb38-11e8-b59b-0cc47a792c0a_files/background073.jpg" width=596 height=843></div>
<div style="position:absolute;left:252.21px;top:353.05px" class="cls_002"><span class="cls_002">Slika 76. logout.component.ts</span></div>
<div style="position:absolute;left:216.18px;top:494.17px" class="cls_002"><span class="cls_002">Slika.77. page-not-found.component.html</span></div>
<div style="position:absolute;left:216.18px;top:737.37px" class="cls_002"><span class="cls_002">Slika 78. page-not-found.component.ts</span></div>
<div style="position:absolute;left:511.18px;top:822.19px" class="cls_002"><span class="cls_002">73</span></div>
</div>
<div style="position:absolute;left:50%;margin-left:-298px;top:62269px;width:596px;height:843px;border-style:outset;overflow:hidden">
<div style="position:absolute;left:0px;top:0px">
<img src="4ef19dde-cb38-11e8-b59b-0cc47a792c0a_id_4ef19dde-cb38-11e8-b59b-0cc47a792c0a_files/background074.jpg" width=596 height=843></div>
<div style="position:absolute;left:216.18px;top:232.20px" class="cls_002"><span class="cls_002">Slika 79. post.component.html</span></div>
<div style="position:absolute;left:216.18px;top:503.18px" class="cls_002"><span class="cls_002">Slika 80. post.component.ts</span></div>
<div style="position:absolute;left:511.18px;top:822.19px" class="cls_002"><span class="cls_002">74</span></div>
</div>
<div style="position:absolute;left:50%;margin-left:-298px;top:63122px;width:596px;height:843px;border-style:outset;overflow:hidden">
<div style="position:absolute;left:0px;top:0px">
<img src="4ef19dde-cb38-11e8-b59b-0cc47a792c0a_id_4ef19dde-cb38-11e8-b59b-0cc47a792c0a_files/background075.jpg" width=596 height=843></div>
<div style="position:absolute;left:216.18px;top:326.78px" class="cls_002"><span class="cls_002">Slika 81. post-details.component.html</span></div>
<div style="position:absolute;left:511.18px;top:822.19px" class="cls_002"><span class="cls_002">75</span></div>
</div>
<div style="position:absolute;left:50%;margin-left:-298px;top:63975px;width:596px;height:843px;border-style:outset;overflow:hidden">
<div style="position:absolute;left:0px;top:0px">
<img src="4ef19dde-cb38-11e8-b59b-0cc47a792c0a_id_4ef19dde-cb38-11e8-b59b-0cc47a792c0a_files/background076.jpg" width=596 height=843></div>
<div style="position:absolute;left:216.18px;top:589.50px" class="cls_002"><span class="cls_002">Slika 82. post-details.component.ts</span></div>
<div style="position:absolute;left:511.18px;top:822.19px" class="cls_002"><span class="cls_002">76</span></div>
</div>
<div style="position:absolute;left:50%;margin-left:-298px;top:64828px;width:596px;height:843px;border-style:outset;overflow:hidden">
<div style="position:absolute;left:0px;top:0px">
<img src="4ef19dde-cb38-11e8-b59b-0cc47a792c0a_id_4ef19dde-cb38-11e8-b59b-0cc47a792c0a_files/background077.jpg" width=596 height=843></div>
<div style="position:absolute;left:252.21px;top:305.01px" class="cls_002"><span class="cls_002">Slika 83. profil.component.html</span></div>
<div style="position:absolute;left:511.18px;top:822.19px" class="cls_002"><span class="cls_002">77</span></div>
</div>
<div style="position:absolute;left:50%;margin-left:-298px;top:65681px;width:596px;height:843px;border-style:outset;overflow:hidden">
<div style="position:absolute;left:0px;top:0px">
<img src="4ef19dde-cb38-11e8-b59b-0cc47a792c0a_id_4ef19dde-cb38-11e8-b59b-0cc47a792c0a_files/background078.jpg" width=596 height=843></div>
<div style="position:absolute;left:252.21px;top:600.76px" class="cls_002"><span class="cls_002">Slika 84. profil.component.ts</span></div>
<div style="position:absolute;left:511.18px;top:822.19px" class="cls_002"><span class="cls_002">78</span></div>
</div>
<div style="position:absolute;left:50%;margin-left:-298px;top:66534px;width:596px;height:843px;border-style:outset;overflow:hidden">
<div style="position:absolute;left:0px;top:0px">
<img src="4ef19dde-cb38-11e8-b59b-0cc47a792c0a_id_4ef19dde-cb38-11e8-b59b-0cc47a792c0a_files/background079.jpg" width=596 height=843></div>
<div style="position:absolute;left:216.18px;top:71.57px" class="cls_002"><span class="cls_002">Slika 85. publish.component.html</span></div>
<div style="position:absolute;left:252.21px;top:597.01px" class="cls_002"><span class="cls_002">Slika 86. publish.component.ts</span></div>
<div style="position:absolute;left:511.18px;top:822.20px" class="cls_002"><span class="cls_002">79</span></div>
</div>
<div style="position:absolute;left:50%;margin-left:-298px;top:67387px;width:596px;height:843px;border-style:outset;overflow:hidden">
<div style="position:absolute;left:0px;top:0px">
<img src="4ef19dde-cb38-11e8-b59b-0cc47a792c0a_id_4ef19dde-cb38-11e8-b59b-0cc47a792c0a_files/background080.jpg" width=596 height=843></div>
<div style="position:absolute;left:252.21px;top:516.69px" class="cls_002"><span class="cls_002">Slika 87. register.component.html</span></div>
<div style="position:absolute;left:511.18px;top:822.19px" class="cls_002"><span class="cls_002">80</span></div>
</div>
<div style="position:absolute;left:50%;margin-left:-298px;top:68240px;width:596px;height:843px;border-style:outset;overflow:hidden">
<div style="position:absolute;left:0px;top:0px">
<img src="4ef19dde-cb38-11e8-b59b-0cc47a792c0a_id_4ef19dde-cb38-11e8-b59b-0cc47a792c0a_files/background081.jpg" width=596 height=843></div>
<div style="position:absolute;left:252.21px;top:623.27px" class="cls_002"><span class="cls_002">Slika 88. register.component.ts</span></div>
<div style="position:absolute;left:511.18px;top:822.19px" class="cls_002"><span class="cls_002">81</span></div>
</div>
<div style="position:absolute;left:50%;margin-left:-298px;top:69093px;width:596px;height:843px;border-style:outset;overflow:hidden">
<div style="position:absolute;left:0px;top:0px">
<img src="4ef19dde-cb38-11e8-b59b-0cc47a792c0a_id_4ef19dde-cb38-11e8-b59b-0cc47a792c0a_files/background082.jpg" width=596 height=843></div>
<div style="position:absolute;left:252.21px;top:282.49px" class="cls_002"><span class="cls_002">Slika 89. show-info.component.html</span></div>
<div style="position:absolute;left:252.21px;top:657.81px" class="cls_002"><span class="cls_002">Slika 90. show-info.component.ts</span></div>
<div style="position:absolute;left:511.18px;top:822.20px" class="cls_002"><span class="cls_002">82</span></div>
</div>
<div style="position:absolute;left:50%;margin-left:-298px;top:69946px;width:596px;height:843px;border-style:outset;overflow:hidden">
<div style="position:absolute;left:0px;top:0px">
<img src="4ef19dde-cb38-11e8-b59b-0cc47a792c0a_id_4ef19dde-cb38-11e8-b59b-0cc47a792c0a_files/background083.jpg" width=596 height=843></div>
<div style="position:absolute;left:216.18px;top:452.13px" class="cls_002"><span class="cls_002">Slika 91. update-book.component.html</span></div>
<div style="position:absolute;left:511.18px;top:822.19px" class="cls_002"><span class="cls_002">83</span></div>
</div>
<div style="position:absolute;left:50%;margin-left:-298px;top:70799px;width:596px;height:843px;border-style:outset;overflow:hidden">
<div style="position:absolute;left:0px;top:0px">
<img src="4ef19dde-cb38-11e8-b59b-0cc47a792c0a_id_4ef19dde-cb38-11e8-b59b-0cc47a792c0a_files/background084.jpg" width=596 height=843></div>
<div style="position:absolute;left:252.21px;top:471.65px" class="cls_002"><span class="cls_002">Slika 92. update-book.component.ts</span></div>
<div style="position:absolute;left:252.21px;top:735.87px" class="cls_002"><span class="cls_002">Slika 93. update-post.component.html</span></div>
<div style="position:absolute;left:511.18px;top:822.20px" class="cls_002"><span class="cls_002">84</span></div>
</div>
<div style="position:absolute;left:50%;margin-left:-298px;top:71652px;width:596px;height:843px;border-style:outset;overflow:hidden">
<div style="position:absolute;left:0px;top:0px">
<img src="4ef19dde-cb38-11e8-b59b-0cc47a792c0a_id_4ef19dde-cb38-11e8-b59b-0cc47a792c0a_files/background085.jpg" width=596 height=843></div>
<div style="position:absolute;left:252.21px;top:538.45px" class="cls_002"><span class="cls_002">Slika 94. update-post.component.ts</span></div>
<div style="position:absolute;left:252.21px;top:725.36px" class="cls_002"><span class="cls_002">Slika 95. users.component.html</span></div>
<div style="position:absolute;left:511.18px;top:822.19px" class="cls_002"><span class="cls_002">85</span></div>
</div>
<div style="position:absolute;left:50%;margin-left:-298px;top:72505px;width:596px;height:843px;border-style:outset;overflow:hidden">
<div style="position:absolute;left:0px;top:0px">
<img src="4ef19dde-cb38-11e8-b59b-0cc47a792c0a_id_4ef19dde-cb38-11e8-b59b-0cc47a792c0a_files/background086.jpg" width=596 height=843></div>
<div style="position:absolute;left:252.21px;top:546.71px" class="cls_002"><span class="cls_002">Slika 96. users.component.ts</span></div>
<div style="position:absolute;left:511.18px;top:822.20px" class="cls_002"><span class="cls_002">86</span></div>
</div>
<div style="position:absolute;left:50%;margin-left:-298px;top:73358px;width:596px;height:843px;border-style:outset;overflow:hidden">
<div style="position:absolute;left:0px;top:0px">
<img src="4ef19dde-cb38-11e8-b59b-0cc47a792c0a_id_4ef19dde-cb38-11e8-b59b-0cc47a792c0a_files/background087.jpg" width=596 height=843></div>
<div style="position:absolute;left:72.06px;top:138.37px" class="cls_007"><span class="cls_007">4. Ostalo</span></div>
<div style="position:absolute;left:72.06px;top:183.65px" class="cls_004"><span class="cls_004">4.1 Linkovi</span></div>
<div style="position:absolute;left:72.06px;top:211.93px" class="cls_002"><span class="cls_002">Tehnologije:</span></div>
<div style="position:absolute;left:72.06px;top:226.94px" class="cls_019"><span class="cls_019"> </span><A HREF="https://angular.io/">https://angular.io/</A> </div>
<div style="position:absolute;left:72.06px;top:241.96px" class="cls_019"><span class="cls_019"> </span><A HREF="https://expressjs.com/">https://expressjs.com/</A> </div>
<div style="position:absolute;left:72.06px;top:256.97px" class="cls_019"><span class="cls_019"> </span><A HREF="https://nodejs.org/en/">https://nodejs.org/en/</A> </div>
<div style="position:absolute;left:72.06px;top:271.98px" class="cls_002"><span class="cls_002"> </span><A HREF="http://mongoosejs.com/">http://mongoosejs.com/</A> </div>
<div style="position:absolute;left:72.06px;top:302.01px" class="cls_002"><span class="cls_002">Tema: </span><span class="cls_019">h<A HREF="https://bootswatch.com/sketchy/">ttps://bootswatch.com/sketchy/</A> </span></div>
<div style="position:absolute;left:72.06px;top:332.03px" class="cls_002"><span class="cls_002">Hosting servis: </span><A HREF="https://www.heroku.com/">https://www.heroku.com/</A> </div>
<div style="position:absolute;left:72.06px;top:362.06px" class="cls_002"><span class="cls_002">Sajt: </span><span class="cls_019">h<A HREF="https://bookclubtrading.herokuapp.com/">ttps://bookclubtrading.herokuapp.com/</A> </span><span class="cls_002">.</span></div>
<div style="position:absolute;left:72.06px;top:392.08px" class="cls_002"><span class="cls_002">Baza podataka: </span><span class="cls_019">h<A HREF="https://mlab.com/">ttps://mlab.com/</A> </span></div>
<div style="position:absolute;left:72.06px;top:422.11px" class="cls_002"><span class="cls_002">Repozitorijum: </span><span class="cls_019">h<A HREF="https://github.com/Vukan-Markovic/Book-trading-club">ttps://github.com/Vukan-Markovic/Book-trading-club</A> </span></div>
<div style="position:absolute;left:511.18px;top:822.19px" class="cls_002"><span class="cls_002">87</span></div>
</div>
<div style="position:absolute;left:50%;margin-left:-298px;top:74211px;width:596px;height:843px;border-style:outset;overflow:hidden">
<div style="position:absolute;left:0px;top:0px">
<img src="4ef19dde-cb38-11e8-b59b-0cc47a792c0a_id_4ef19dde-cb38-11e8-b59b-0cc47a792c0a_files/background088.jpg" width=596 height=843></div>
<div style="position:absolute;left:72.06px;top:288.00px" class="cls_004"><span class="cls_004">4.2 Sajt</span></div>
<div style="position:absolute;left:180.15px;top:708.10px" class="cls_002"><span class="cls_002">Slika 97. Naslovna strana sajta iz aspekta neregistrovanog korisnika</span></div>
<div style="position:absolute;left:511.18px;top:822.20px" class="cls_002"><span class="cls_002">88</span></div>
</div>
<div style="position:absolute;left:50%;margin-left:-298px;top:75064px;width:596px;height:843px;border-style:outset;overflow:hidden">
<div style="position:absolute;left:0px;top:0px">
<img src="4ef19dde-cb38-11e8-b59b-0cc47a792c0a_id_4ef19dde-cb38-11e8-b59b-0cc47a792c0a_files/background089.jpg" width=596 height=843></div>
<div style="position:absolute;left:72.06px;top:495.67px" class="cls_002"><span class="cls_002">Slika 98. Neregistrovan korisnik može samo da pregleda dostupne knjige bez ostalih</span></div>
<div style="position:absolute;left:511.18px;top:822.19px" class="cls_002"><span class="cls_002">89</span></div>
</div>
<div style="position:absolute;left:50%;margin-left:-298px;top:75917px;width:596px;height:843px;border-style:outset;overflow:hidden">
<div style="position:absolute;left:0px;top:0px">
<img src="4ef19dde-cb38-11e8-b59b-0cc47a792c0a_id_4ef19dde-cb38-11e8-b59b-0cc47a792c0a_files/background090.jpg" width=596 height=843></div>
<div style="position:absolute;left:180.15px;top:410.10px" class="cls_002"><span class="cls_002">Slika 99. Login strana vidljiva samo ako korisnik nije već ulogovan</span></div>
<div style="position:absolute;left:511.18px;top:822.20px" class="cls_002"><span class="cls_002">90</span></div>
</div>
<div style="position:absolute;left:50%;margin-left:-298px;top:76770px;width:596px;height:843px;border-style:outset;overflow:hidden">
<div style="position:absolute;left:0px;top:0px">
<img src="4ef19dde-cb38-11e8-b59b-0cc47a792c0a_id_4ef19dde-cb38-11e8-b59b-0cc47a792c0a_files/background091.jpg" width=596 height=843></div>
<div style="position:absolute;left:180.15px;top:71.56px" class="cls_002"><span class="cls_002">Slika 100. Blog, neregistrovan korisnik može samo da pregleda objave</span></div>
<div style="position:absolute;left:216.18px;top:407.84px" class="cls_002"><span class="cls_002">Slika 101. About stranica sa kratkim opisom sajta</span></div>
<div style="position:absolute;left:511.18px;top:822.19px" class="cls_002"><span class="cls_002">91</span></div>
</div>
<div style="position:absolute;left:50%;margin-left:-298px;top:77623px;width:596px;height:843px;border-style:outset;overflow:hidden">
<div style="position:absolute;left:0px;top:0px">
<img src="4ef19dde-cb38-11e8-b59b-0cc47a792c0a_id_4ef19dde-cb38-11e8-b59b-0cc47a792c0a_files/background092.jpg" width=596 height=843></div>
<div style="position:absolute;left:144.12px;top:250.97px" class="cls_002"><span class="cls_002">Slika 101. Register stranica vidljiva samo korisnicima koji nisu registrovani</span></div>
<div style="position:absolute;left:144.12px;top:265.98px" class="cls_002"><span class="cls_002">(ulogovani)</span></div>
<div style="position:absolute;left:144.12px;top:692.34px" class="cls_002"><span class="cls_002">Slika 102. Administator se identifikuje preko email-a koji je jedinstven</span></div>
<div style="position:absolute;left:511.18px;top:822.20px" class="cls_002"><span class="cls_002">92</span></div>
</div>
<div style="position:absolute;left:50%;margin-left:-298px;top:78476px;width:596px;height:843px;border-style:outset;overflow:hidden">
<div style="position:absolute;left:0px;top:0px">
<img src="4ef19dde-cb38-11e8-b59b-0cc47a792c0a_id_4ef19dde-cb38-11e8-b59b-0cc47a792c0a_files/background093.jpg" width=596 height=843></div>
<div style="position:absolute;left:72.06px;top:447.63px" class="cls_002"><span class="cls_002">Slika 103. Detalji knjige sa aspekta administatora koji može da kupuje, briše, menja i</span></div>
<div style="position:absolute;left:72.06px;top:462.64px" class="cls_002"><span class="cls_002">komentriše sve knjige</span></div>
<div style="position:absolute;left:511.18px;top:822.19px" class="cls_002"><span class="cls_002">93</span></div>
</div>
<div style="position:absolute;left:50%;margin-left:-298px;top:79329px;width:596px;height:843px;border-style:outset;overflow:hidden">
<div style="position:absolute;left:0px;top:0px">
<img src="4ef19dde-cb38-11e8-b59b-0cc47a792c0a_id_4ef19dde-cb38-11e8-b59b-0cc47a792c0a_files/background094.jpg" width=596 height=843></div>
<div style="position:absolute;left:72.06px;top:425.11px" class="cls_002"><span class="cls_002">Slika 104. Objava na blogu sa aspekta administratora koji može da menja i briše sve objave</span></div>
<div style="position:absolute;left:72.06px;top:738.88px" class="cls_002"><span class="cls_002">Slika 105. Objavljivanje novog posta, ovu mogućnost imaju samo registrovani korisnici</span></div>
<div style="position:absolute;left:511.18px;top:822.20px" class="cls_002"><span class="cls_002">94</span></div>
</div>
<div style="position:absolute;left:50%;margin-left:-298px;top:80182px;width:596px;height:843px;border-style:outset;overflow:hidden">
<div style="position:absolute;left:0px;top:0px">
<img src="4ef19dde-cb38-11e8-b59b-0cc47a792c0a_id_4ef19dde-cb38-11e8-b59b-0cc47a792c0a_files/background095.jpg" width=596 height=843></div>
<div style="position:absolute;left:108.09px;top:470.90px" class="cls_002"><span class="cls_002">Slika 106. Administrator ima mogućnost pregleda svih registrovanih korisnika</span></div>
<div style="position:absolute;left:511.18px;top:822.19px" class="cls_002"><span class="cls_002">95</span></div>
</div>
<div style="position:absolute;left:50%;margin-left:-298px;top:81035px;width:596px;height:843px;border-style:outset;overflow:hidden">
<div style="position:absolute;left:0px;top:0px">
<img src="4ef19dde-cb38-11e8-b59b-0cc47a792c0a_id_4ef19dde-cb38-11e8-b59b-0cc47a792c0a_files/background096.jpg" width=596 height=843></div>
<div style="position:absolute;left:252.21px;top:596.26px" class="cls_002"><span class="cls_002">Slika 107. Profilna strana</span></div>
<div style="position:absolute;left:511.18px;top:822.20px" class="cls_002"><span class="cls_002">96</span></div>
</div>
<div style="position:absolute;left:50%;margin-left:-298px;top:81888px;width:596px;height:843px;border-style:outset;overflow:hidden">
<div style="position:absolute;left:0px;top:0px">
<img src="4ef19dde-cb38-11e8-b59b-0cc47a792c0a_id_4ef19dde-cb38-11e8-b59b-0cc47a792c0a_files/background097.jpg" width=596 height=843></div>
<div style="position:absolute;left:252.21px;top:708.10px" class="cls_002"><span class="cls_002">Slika 108. Ažuriranje knjige</span></div>
<div style="position:absolute;left:511.18px;top:822.19px" class="cls_002"><span class="cls_002">97</span></div>
</div>
<div style="position:absolute;left:50%;margin-left:-298px;top:82741px;width:596px;height:843px;border-style:outset;overflow:hidden">
<div style="position:absolute;left:0px;top:0px">
<img src="4ef19dde-cb38-11e8-b59b-0cc47a792c0a_id_4ef19dde-cb38-11e8-b59b-0cc47a792c0a_files/background098.jpg" width=596 height=843></div>
<div style="position:absolute;left:252.21px;top:371.07px" class="cls_002"><span class="cls_002">Slika 109. Pregled korisnikove knjige</span></div>
<div style="position:absolute;left:511.18px;top:822.20px" class="cls_002"><span class="cls_002">98</span></div>
</div>
<div style="position:absolute;left:50%;margin-left:-298px;top:83594px;width:596px;height:843px;border-style:outset;overflow:hidden">
<div style="position:absolute;left:0px;top:0px">
<img src="4ef19dde-cb38-11e8-b59b-0cc47a792c0a_id_4ef19dde-cb38-11e8-b59b-0cc47a792c0a_files/background099.jpg" width=596 height=843></div>
<div style="position:absolute;left:216.18px;top:414.60px" class="cls_002"><span class="cls_002">Slika 110. Pregled knjige od strane drugog korisnika</span></div>
<div style="position:absolute;left:511.18px;top:822.19px" class="cls_002"><span class="cls_002">99</span></div>
</div>
<div style="position:absolute;left:50%;margin-left:-298px;top:84447px;width:596px;height:843px;border-style:outset;overflow:hidden">
<div style="position:absolute;left:0px;top:0px">
<img src="4ef19dde-cb38-11e8-b59b-0cc47a792c0a_id_4ef19dde-cb38-11e8-b59b-0cc47a792c0a_files/background100.jpg" width=596 height=843></div>
<div style="position:absolute;left:216.18px;top:413.10px" class="cls_002"><span class="cls_002">Slika 111. Dodavanje novog komentara</span></div>
<div style="position:absolute;left:505.17px;top:822.20px" class="cls_002"><span class="cls_002">100</span></div>
</div>
<div style="position:absolute;left:50%;margin-left:-298px;top:85300px;width:596px;height:843px;border-style:outset;overflow:hidden">
<div style="position:absolute;left:0px;top:0px">
<img src="4ef19dde-cb38-11e8-b59b-0cc47a792c0a_id_4ef19dde-cb38-11e8-b59b-0cc47a792c0a_files/background101.jpg" width=596 height=843></div>
<div style="position:absolute;left:252.21px;top:397.34px" class="cls_002"><span class="cls_002">Slika 112. Dodani komentar</span></div>
<div style="position:absolute;left:505.17px;top:822.19px" class="cls_002"><span class="cls_002">101</span></div>
</div>
<div style="position:absolute;left:50%;margin-left:-298px;top:86153px;width:596px;height:843px;border-style:outset;overflow:hidden">
<div style="position:absolute;left:0px;top:0px">
<img src="4ef19dde-cb38-11e8-b59b-0cc47a792c0a_id_4ef19dde-cb38-11e8-b59b-0cc47a792c0a_files/background102.jpg" width=596 height=843></div>
<div style="position:absolute;left:180.15px;top:413.10px" class="cls_002"><span class="cls_002">Slika 113. Pregled objave sa apseta korisnika koji nije administrator</span></div>
<div style="position:absolute;left:252.21px;top:473.15px" class="cls_002"><span class="cls_002">Slika 114. Dodavanje nove knjige</span></div>
<div style="position:absolute;left:505.17px;top:822.20px" class="cls_002"><span class="cls_002">102</span></div>
</div>
<div style="position:absolute;left:50%;margin-left:-298px;top:87006px;width:596px;height:843px;border-style:outset;overflow:hidden">
<div style="position:absolute;left:0px;top:0px">
<img src="4ef19dde-cb38-11e8-b59b-0cc47a792c0a_id_4ef19dde-cb38-11e8-b59b-0cc47a792c0a_files/background103.jpg" width=596 height=843></div>
<div style="position:absolute;left:144.12px;top:71.56px" class="cls_002"><span class="cls_002">Slika 115. Korisnik može da vidi podatke neophodne za obavljanje kupovine</span></div>
<div style="position:absolute;left:108.09px;top:663.81px" class="cls_002"><span class="cls_002">...onog korisnika koji ju je izvršio.</span></div>
<div style="position:absolute;left:505.17px;top:822.19px" class="cls_002"><span class="cls_002">103</span></div>
</div>
<div style="position:absolute;left:50%;margin-left:-298px;top:87859px;width:596px;height:843px;border-style:outset;overflow:hidden">
<div style="position:absolute;left:0px;top:0px">
<img src="4ef19dde-cb38-11e8-b59b-0cc47a792c0a_id_4ef19dde-cb38-11e8-b59b-0cc47a792c0a_files/background104.jpg" width=596 height=843></div>
<div style="position:absolute;left:72.06px;top:89.08px" class="cls_004"><span class="cls_004">4.3Bazapodataka</span></div>
<div style="position:absolute;left:505.17px;top:822.20px" class="cls_002"><span class="cls_002">104</span></div>
</div>
<div style="position:absolute;left:50%;margin-left:-298px;top:88712px;width:596px;height:843px;border-style:outset;overflow:hidden">
<div style="position:absolute;left:0px;top:0px">
<img src="4ef19dde-cb38-11e8-b59b-0cc47a792c0a_id_4ef19dde-cb38-11e8-b59b-0cc47a792c0a_files/background105.jpg" width=596 height=843></div>
<div style="position:absolute;left:505.17px;top:822.19px" class="cls_002"><span class="cls_002">105</span></div>
</div>
</body>
</html>