Download any font you like from internet, and then double click the ttf file then it will open a new dialog like this
oooor... you can directly put the .ttf file to "C:\Windows\Fonts". Example :
Then to make sure that it's installed, let's see it in inkscape (restart your inkscape if it's opened)...
Okiee.... So we can see that Beach.ttf is already installed...
Kalu g' ngerti silahkan tinggalkan komentar dikolom komentar... :-)
Showing posts with label Windows 7. Show all posts
Showing posts with label Windows 7. Show all posts
Friday, August 17, 2018
Friday, February 9, 2018
Getter di Vuex
Dipostingan sebelumnya kita udah ngebuat store yg kita akses lngsung datanya lewat state. Naah..sebenarnya ada cara lain yaitu pake getters, contohnya kek gini :
Naah... di bagian getters kita bikin 2 biji getters masing-masing buat main dan biju teams, cmn yg biju team blom dilengkapin. Trs yg getter buat main_teams tuh ngambil state (state =>) trs dari state access ke main_teams (state.main_teams), nah karena main_teams berupa array berarti kita bisa ngeloop ke element2nya lewat map (main_teams.map). Dari map ini kita kembaliin lagi nilai arraynya tapi dengan sedikit modifikasi kyk object di return itu (line 25 smpe 27).
Siipss... klu kita pengen akses gettersnya di vue component, caranya mirip2 ajjah sama akses state kek gini
Siipss... hasilnya
Siiipss... cara yg sama bisa kita aplikasiin ke bijuu_teamss yeeaah... :D
Kode selengkapnya bisa dilihat disini.....
Postingan berikutnya tentang mutations, bisa dilihat disini...
Naah... di bagian getters kita bikin 2 biji getters masing-masing buat main dan biju teams, cmn yg biju team blom dilengkapin. Trs yg getter buat main_teams tuh ngambil state (state =>) trs dari state access ke main_teams (state.main_teams), nah karena main_teams berupa array berarti kita bisa ngeloop ke element2nya lewat map (main_teams.map). Dari map ini kita kembaliin lagi nilai arraynya tapi dengan sedikit modifikasi kyk object di return itu (line 25 smpe 27).
Siipss... klu kita pengen akses gettersnya di vue component, caranya mirip2 ajjah sama akses state kek gini
Siipss... hasilnya
Siiipss... cara yg sama bisa kita aplikasiin ke bijuu_teamss yeeaah... :D
Kode selengkapnya bisa dilihat disini.....
Postingan berikutnya tentang mutations, bisa dilihat disini...
Membuat List Member Menggunakan Vuex
Disini kita akan membuat list member menggunakan vuex. So silahkan ikuti postingan ini untuk settingan awalnya...
Pertama-tama kita udah punya webpack-simple yg hanya menggunakan vuejs yang tampilan webnya kek gini..
Naah... Karena kita g' butuh tampilan layout diatas, jadi pertama-tama kita delete dl element2 yg digunain di App.vue seperti terlihat pada gambar di bawah... (lbih jelasnya silahkan liad commitnya di sini...)
Klu udah diremove... berarti tampilan layout utama kita sekarang jadi kosong... :D
Siiipss... berikutnya kita buat 2 biji file .vue yg baru.... Kita buat directory baru ajjah namanya 'components' terus didalem folder components ini kita bikin 2 biji file.vue kek gini :
Siipss...berikutnya kita isiin kode berikut untuk kedua file vuenya...
Lebih jelasnya bisa dilihat diisini...
Siiipss... berikutnya kita masukin kedua file vue tadi ke app.vue. Carana kek gini ajjah...
Lebih lengkapnya bisa dlihat disini....
So jadi dalam kode diatas kita import main_team_member.vue dan bijuu_team.vue trs dimasukin ke variabel components. Naah.. didalam variabel component ini MainTeam diassign ke main-team & bijuu-team. Akhirnya main-team & biju-team dapat dikenali oleh template sehingga dipanggil kyk <main-team> & <bijuu-team>. Trs klu liad isi dari main-team sama bijuu-team itu cuma <h1> ajjah kegini :
Makanya tampilan web kita sekarang menjadi seperti ini ...
Naaah... berikutnya baru kita tambain store yg diambil dari vuex. Store ini nantinya nyimpen beberapa item kyk state, getters, actions, mutations dan modules....
So... mari kita install vuexnya dl
npm install vuex --save
Trs kita bikin folder baru namanya 'store' trs didalem folder ini kita bikin file javascript namanya 'store.js', trs taroin kek gini :
Naaah... itu kerangka utama store di vuex. Trs di line ke-4, itu maksudnya biar vuex dipake didalem vue. Klu misalkan kita pengen pake plugin yg lain kyk firebase, nah berarti tar firebasenya jg diadd diistu kyk Vue.use(firebase) naah... gitu gitu laah... :D
Terus biar storenya bisa diakses sama komponent2 kita, kita harus nambain store ini ke main.js kek gini :
Siiipss... klu udah ditambain kyk diatas, komponen apapun yg kehubung ke App.vue bakalan bisa akses store yg baru kita bikin....Siipss... berikutnya kita tambain data dummy dl ke state distore kita kek gini :
trs didalem komponen main_team_member.vue kita akses dan tampilin isi statenya kek gini :
Perubahan kode selengkapnya bisa dilihat disiniiii....
Hasilnya...
Siiipss... Trs statenya berikutnya yg tambain adalah yg buat bijuu_team kek gini daah...
Selengkapnya bisa dilihat disini...
Hasilnya...
Siiipss... sampai disini kita baru make STATE di storenya vuex.... daaan... ckup sampai disini dlu ehehe... :D
Postingan berikutnya ttg getters bisa dilihat disini...
Pertama-tama kita udah punya webpack-simple yg hanya menggunakan vuejs yang tampilan webnya kek gini..
Naah... Karena kita g' butuh tampilan layout diatas, jadi pertama-tama kita delete dl element2 yg digunain di App.vue seperti terlihat pada gambar di bawah... (lbih jelasnya silahkan liad commitnya di sini...)
Klu udah diremove... berarti tampilan layout utama kita sekarang jadi kosong... :D
Siiipss... berikutnya kita buat 2 biji file .vue yg baru.... Kita buat directory baru ajjah namanya 'components' terus didalem folder components ini kita bikin 2 biji file.vue kek gini :
Siipss...berikutnya kita isiin kode berikut untuk kedua file vuenya...
Lebih jelasnya bisa dilihat diisini...
Siiipss... berikutnya kita masukin kedua file vue tadi ke app.vue. Carana kek gini ajjah...
Lebih lengkapnya bisa dlihat disini....
So jadi dalam kode diatas kita import main_team_member.vue dan bijuu_team.vue trs dimasukin ke variabel components. Naah.. didalam variabel component ini MainTeam diassign ke main-team & bijuu-team. Akhirnya main-team & biju-team dapat dikenali oleh template sehingga dipanggil kyk <main-team> & <bijuu-team>. Trs klu liad isi dari main-team sama bijuu-team itu cuma <h1> ajjah kegini :
Makanya tampilan web kita sekarang menjadi seperti ini ...
Naaah... berikutnya baru kita tambain store yg diambil dari vuex. Store ini nantinya nyimpen beberapa item kyk state, getters, actions, mutations dan modules....
So... mari kita install vuexnya dl
npm install vuex --save
Trs kita bikin folder baru namanya 'store' trs didalem folder ini kita bikin file javascript namanya 'store.js', trs taroin kek gini :
Naaah... itu kerangka utama store di vuex. Trs di line ke-4, itu maksudnya biar vuex dipake didalem vue. Klu misalkan kita pengen pake plugin yg lain kyk firebase, nah berarti tar firebasenya jg diadd diistu kyk Vue.use(firebase) naah... gitu gitu laah... :D
Terus biar storenya bisa diakses sama komponent2 kita, kita harus nambain store ini ke main.js kek gini :
Siiipss... klu udah ditambain kyk diatas, komponen apapun yg kehubung ke App.vue bakalan bisa akses store yg baru kita bikin....Siipss... berikutnya kita tambain data dummy dl ke state distore kita kek gini :
trs didalem komponen main_team_member.vue kita akses dan tampilin isi statenya kek gini :
Perubahan kode selengkapnya bisa dilihat disiniiii....
Hasilnya...
Siiipss... Trs statenya berikutnya yg tambain adalah yg buat bijuu_team kek gini daah...
Selengkapnya bisa dilihat disini...
Hasilnya...
Siiipss... sampai disini kita baru make STATE di storenya vuex.... daaan... ckup sampai disini dlu ehehe... :D
Postingan berikutnya ttg getters bisa dilihat disini...
Thursday, February 1, 2018
Maen vue cli di Windows 7
Nyoba2 dari github ini :
https://github.com/vuejs/vue-cli/tree/master
Instalasi :
Nah.. stelah ke install kita bisa pke beberapa template buat vuejs-nya...Template yg tersedia tuuh seperti pada readme.md di githubnya kek gini :
Naah... dipostingan ini kita pake yg 'webpack-simple' dl ajjah... so jalanin perintah ini di cmd :
vue init webpack-simple hisoka_simple_webpack_project
Stlah itu kita dminta beberapa pertanyaan...klu mau boleh ajjah lngsung dienter-enter smpe slese...
klu udah slese tar kek gini :
Naaah... jadi pertama kita harus jalanin "npm install" dl buat ngedownload dependency projectnya...
Naaah... stelah selese... tinggal ngerun 'npm run dev'
Terus klu kita bua localhost:8080/ hasilnya :
Siiipsss... berhasil daaaah... :D
https://github.com/vuejs/vue-cli/tree/master
Instalasi :
Nah.. stelah ke install kita bisa pke beberapa template buat vuejs-nya...Template yg tersedia tuuh seperti pada readme.md di githubnya kek gini :
Naah... dipostingan ini kita pake yg 'webpack-simple' dl ajjah... so jalanin perintah ini di cmd :
vue init webpack-simple hisoka_simple_webpack_project
Stlah itu kita dminta beberapa pertanyaan...klu mau boleh ajjah lngsung dienter-enter smpe slese...
klu udah slese tar kek gini :
Naaah... jadi pertama kita harus jalanin "npm install" dl buat ngedownload dependency projectnya...
Naaah... stelah selese... tinggal ngerun 'npm run dev'
Terus klu kita bua localhost:8080/ hasilnya :
Saturday, November 25, 2017
Installing Webform Module in Drupal 7 - Windows 7
First step... Download the webform module from https://www.drupal.org/project/webform
{https://ftp.drupal.org/files/projects/webform-7.x-4.16.zip}
Neext... Open module tab... and then choose "Install new module"
Browse the webform zip file then hit "Install" button
Just wait for several seconds.... :)
If we go back to module, we can the webform desc rightnow...
Buut.. unfortunately, it needs Ctools and Views... :D
So we need to install them also.... Installation steps are same like above... Just download the zip files..
Ctools:
https://www.drupal.org/project/views
https://ftp.drupal.org/files/projects/ctools-7.x-1.12.zip
Views:
https://www.drupal.org/project/ctools
https://ftp.drupal.org/files/projects/views-7.x-3.18.zip
After installing those 2 modules, we need to enable them like this
After hiting "Save configuration" button....
Okaaaay.... That's all.... :)
ooowh... If we want to add a new webform, we can click "add content" as shown on the picture below
{https://ftp.drupal.org/files/projects/webform-7.x-4.16.zip}
Neext... Open module tab... and then choose "Install new module"
Browse the webform zip file then hit "Install" button
Just wait for several seconds.... :)
If we go back to module, we can the webform desc rightnow...
Buut.. unfortunately, it needs Ctools and Views... :D
So we need to install them also.... Installation steps are same like above... Just download the zip files..
Ctools:
https://www.drupal.org/project/views
https://ftp.drupal.org/files/projects/ctools-7.x-1.12.zip
Views:
https://www.drupal.org/project/ctools
https://ftp.drupal.org/files/projects/views-7.x-3.18.zip
After installing those 2 modules, we need to enable them like this
After hiting "Save configuration" button....
Okaaaay.... That's all.... :)
ooowh... If we want to add a new webform, we can click "add content" as shown on the picture below
Friday, November 24, 2017
Installing CiviCRM in Drupal 7 - Windows 7
In this post we are going to install CiviCRM in Drupal for windows 7. I'm currently using WAMP for this post. Also if you haven't installed drupal, you can see the steps from this post... Next... Open drupal module page :
Choose "Install new module" as shown in above picture... And then put civicrm url installation :
https://storage.googleapis.com/civicrm/civicrm-stable/4.7.27/civicrm-4.7.27-drupal.tar.gz
We can always check the latest civicrm update from it's official site here... Rightnow the latest version is 4.7.27... After putting the url, just hit "Install button" and wait for several minutes... :)
After it finished... We'll see a page like this :
Okaaaay... If we go back to modules, we'll gonna see civicrm desc like this one
Next... Wee need to run the civicrm installer. So open this link :
http://your local site/web/sites/all/modules/civicrm/install/index.php
For me, it will be
http://localhost:8181/hisoka_drupal7/web/sites/all/modules/civicrm/install/index.php
By opening that link, it actually opens this file :
Aaandd... after opening the page, we'll gonna see this ...
Our next job is configuring database for drupal and civicrm. And in this post, I'm going to separate the database between drupal and civicrm, so I set the configuration like this :
Next just hit "Re-check requirements"... aaaaaand....
ooopsss... there is an error...:v
Just add "thread_stack = 262144" to your my.ini file. For detail about adding that thread_stack, please this page.... And then hit "Re-check requirements" button again aaaaand....
Yaapss... it's okie now.. So we just need to hit "install" button..
Just wait for couple of minutes....aaaand... donee.... :D
Yeeeeeiiii.... :D
We can see civiCRM on our main menu rightnow...
Choose "Install new module" as shown in above picture... And then put civicrm url installation :
https://storage.googleapis.com/civicrm/civicrm-stable/4.7.27/civicrm-4.7.27-drupal.tar.gz
We can always check the latest civicrm update from it's official site here... Rightnow the latest version is 4.7.27... After putting the url, just hit "Install button" and wait for several minutes... :)
After it finished... We'll see a page like this :
Okaaaay... If we go back to modules, we'll gonna see civicrm desc like this one
Next... Wee need to run the civicrm installer. So open this link :
http://your local site/web/sites/all/modules/civicrm/install/index.php
For me, it will be
http://localhost:8181/hisoka_drupal7/web/sites/all/modules/civicrm/install/index.php
By opening that link, it actually opens this file :
Aaandd... after opening the page, we'll gonna see this ...
Our next job is configuring database for drupal and civicrm. And in this post, I'm going to separate the database between drupal and civicrm, so I set the configuration like this :
Next just hit "Re-check requirements"... aaaaaand....
ooopsss... there is an error...:v
Just add "thread_stack = 262144" to your my.ini file. For detail about adding that thread_stack, please this page.... And then hit "Re-check requirements" button again aaaaand....
Yaapss... it's okie now.. So we just need to hit "install" button..
Just wait for couple of minutes....aaaand... donee.... :D
Yeeeeeiiii.... :D
We can see civiCRM on our main menu rightnow...
Subscribe to:
Posts (Atom)