Dimensi TutupBotol

Thursday, November 29, 2018

Proses instalasi Free Download Manager

Free Download Manager adalah software alternative selain menggunakan internet download manager. Jadi klu misalkan pengen aman dari software bajakan, naah silahkan install FDM ini yang langkah2nya seperti terlihat pada gambar-gambar dibawah :

Trus sebaiknya kita juga install add-onsnya buat google chrome biar apapun yang kita download dari googlechrome bisa automatis kedetek buat didownload oleh fdmnya. Caranya silahkan kunjugi chrome storenya disini ....

Siipss daah... :-)

Monday, November 26, 2018

Konversi SASS ke CSS menggunakan GruntJS

Dipostingan sebelumnya kita udan nyiapin environment development buat gruntjs. Trs udah nyoba2in juga gimana caranya ngebuat dan ngerunning task. So dipostingan ini kita akan mencoba mengkompile atw mengkonvert sass ke css menggunakan gruntjs.

Pertama-tama, mari kita buat kode sass yang sangat sederhana saja seperti terlihat pada gambar dibawah :

Jadi intinya kita ngebuat folder baru 'sass'. Terus didalem sass ini ada file adimixins.scss yang isinya bisa dilihat diatas. Terus mixins tersebut diload di styles.scss....
Siiipssss.... Berikutnya kita install dl package dari npm yaitu node-sass dan grunt-sass buat ngekonvert file sass tersebut diatas ke csss. Cara installnya bisa dilihat dicommand prompt screen dibawah :

Jadi sekarang kita udah punya grunt-sass dan node-sass di packge.json kita seperti terlihat dibawah :

Okie berikutnya kita load grunt-sass di Gruntfile.js. Untuk ngeload kita bisa liad contohnya di grunt-sass pagenya. Dari page tersebut kita masukin kode dibawah :

module.exports = function(grunt) {
    const sass = require('node-sass');
    // Configuration
    grunt.initConfig({
        // pass in options to plugins
        // refenrece to files etc
        sass: {
            options: {
                implementation: sass
            },
            dist: {
                files: [{
                    src: 'sass/styles.scss',
                    dest: 'css/main.css'
                }]
            }
        }
    });

    
    // Load plugins
    grunt.loadNpmTasks('grunt-sass');

    
    // Register tasks
    grunt.registerTask('convert-sass', 'sass');
    
    grunt.registerTask('run', function() {
        console.log('running task from grunt');
    });

    grunt.registerTask('testajjah', function() {
        console.log('running test task from grunt');
    });

    grunt.registerTask('allTasks', ['run', 'testajjah'])
}

Kode diatas intinya ngebuat konfigurasi sassnya. Jadi styles.scss (di sass/styles.css) yang bakalan dikonvert ke css yang lokasinya di css/main.css. Trs di line 22, kita ngeload grunt-sassnya dan diline 26 kita ngebuat grunt task yang baru. So klu kita run 'grunt convert-sass', hasilnya adalah :

Siipss... sekian untuk proses konversinya... semoga bermanfaat... :-)