Vue.js Todo lista

Vue je javascript framework za izgradnju aplikacija koje se izvršavaju na klijentovom pregledniku. Vue je reaktivan to znači da se programer ne mora brinuti oko javascript-a koji će osvježavati html komponente

Ova scripta je jednostavan primjer kako napraviti jednostavnu todo listu. Instalacija se dodaje na početku sa: <script src="https://unpkg.com/vue@next"></script>. Imamo dvije metode (funkcije) addItem() i deleteItem() koje se nalaze pod methods:{}. Nakon svake akcije od starane klijenta i izmijene u nizu tasks tablica <table id="todoTable"> se refresh-a automatski sa novim podacima

 


<html>
<head>
    <script src="https://unpkg.com/vue@next"></script>
    <title>Todo list</title>
</head>
<body>

<div id="app">
    <input type="text" placeholder="naziv zadatka"  v-model="taskInput">
    <button @click="addItem">Dodaj</button><br>
    

        <table id="todoTable">
            <tr v-for="(task,index) in tasks">
              <td><b>{{index + 1}}.</b></td><td>{{task.content}}</td><td><button  @click="deleteItem(index)">Briši</button>
           </td>
           </tr>
           <tr><td colspan="2">Ukupno:</td><td>{{ukupno}}</td></tr>
        </table>

  </div>

    <script>
const app ={data(){
        return{
          taskInput : "",
          tasks : [],
          ukupno : 0,
    }

    },
    methods:{
        addItem(){
            if(this.taskInput!=""){
            newTask = {
                content : this.taskInput,
            }
            this.tasks.push(newTask)
            this.taskInput=""
            this.ukupno++;
            }
        },
        deleteItem(index){
            this.tasks.splice(index, 1);
            this.ukupno--;
        },
    }
}


Vue.createApp(app).mount("#app")

</script>

</body>
</html>

Blender Layer Weight

Blender Layer Weight kako postaviti

React

React je vrlo popularna JavaScript biblioteka za izradu korisčkog sučelja, koja se koristi u velikom broju web aplikacija

fractal tree

The drawTree function is called recursively to draw smaller branches, which in turn spawn even smaller branches, creating the fractal pattern.

Sortiranje brojeva

Kod nizova u javascriptu prilikom sortiranja stringova koristimo metodu sort(), kod sortiranja brojeva trebamo dodati dodatnu funkciju

Strojno učenje

Strojno učenje je revolucionarna tehnologija koja pomaže u automatiziranju zaključivanja iz podataka i stvaranju modela koji su u stanju generalizirati.

Canvas API

Canvas API je jedna od ključnih tehnologija HTML5 koja omogućuje web stranicama da postanu interaktivne i dinamičke.

Padajući izbornik

Kako u html-u napraviti padajući izbornik koji se generira pomoću javascript-a?

Kolekcije

Javascript Map omogućuje stvaranje kolekcija koje imaju ključ i vrijednost