Friday, 29 June 2018

Vue CLI V2 And V3

Looking at vue-cli repository I see two different ways of scaffolding vue projects.
The v3 (beta) version, installed as npm install -g @vue/cli, creates projects using the following command:
vue create my-project
While the version 2.9.x, available at master branch, is installed as npm install -g vue-cli and it allows projects scaffolding with the following:
vue init <template-name> <project-name>
for example:
vue init webpack my-project
So, in your scenario, for v3 version you should use: vue create test-app.
Here you can find further information.

Thursday, 28 June 2018

Building and Extract APK using APKtool

ibotpeaches.github.io/Apktool

A tool for reverse engineering 3rd party, closed, binary Android apps. It can decode resources to nearly original form and rebuild them after making some modifications. It also makes working with an app easier because of the project like file structure and automation of some repetitive tasks like building apk, etc.
It is NOT intended for piracy and other non-legal uses. It could be used for localizing, adding some features or support for custom platforms, analyzing applications and much more.

Extract apk and rebuild

Wednesday, 27 June 2018

Reading Javascript #1

Variable & array


[ 'item 1', 'item 2', 'item 3' ] ← this is array item is value

var ← this refering to variable

var todos ← this is the name of variable

var todos = [ 'item 1', 'item 2', 'item 3' ] ← this complete variable how it should look like.

variable contain name and array. Array is a data

-------------------------------------------------------------------------------------------------------
-------------------------------------------------------------------------------------------------------

console.log


console.log('hello there') ← this is console.log, it show the text print
console.log('hello there', 'muhaza')  ← this is how to combine 2 text

'string' 'value' inside of this '' can be describe as string or value.

-------------------------------------------------------------------------------------------------------
-------------------------------------------------------------------------------------------------------

Combine Variable with Console.log


var todos = [ 'item 1', 'item 2', 'item 3' ] ← declare var first
console.log(todos) ← call it by using console.log

Declare and Call terms for my personal note

Variable named todos declared  as [ 'item 1', 'item 2', 'item 3' ] values now its complete as data


-------------------------------------------------------------------------------------------------------
-------------------------------------------------------------------------------------------------------

to print as text or variable 


console.log(todos) ← this will print as variable

console.log('buat') ← this will be print as text

console.log('buat', todos) ← this will be print text and variable

'buat' is text value, todos is var name that have array with variable data.

-------------------------------------------------------------------------------------------------------
-------------------------------------------------------------------------------------------------------


Problem :  Now its already declare var todos have 3 array item. How to add more?

-------------------------------------------------------------------------------------------------------


.push to add more array on declared var


todos.push('item 4') ← add .push after array name and set new array

using () not using []


-------------------------------------------------------------------------------------------------------
-------------------------------------------------------------------------------------------------------


Problem :  I have added array item and i want to delete it..

-------------------------------------------------------------------------------------------------------

1. should notice which item inside array you want to delete?
2. you should know that computer start counting from 0

todos[0] ← call the var name and using [] call first item inside array.
todos[1] ← call the var name and using [] call second item inside array.

todos[0] = 'item change' ←  add = and declare new item or value

Result gonna be by type todos on console

before

["item 1", "item 2", "item 3", "item 4"] 

after

["item change", "item 2", "item 3", "item 4"] 



-------------------------------------------------------------------------------------------------------
-------------------------------------------------------------------------------------------------------

Tuesday, 26 June 2018

Remove .html / .php from url

create .htaccess and copy paste code below

RewriteEngine on
RewriteCond %{THE_REQUEST} /([^.]+)\.html [NC]
RewriteRule ^ /%1 [NC,L,R]
RewriteCond %{REQUEST_FILENAME}.html -f
RewriteRule ^ %{REQUEST_URI}.html [NC,L]
RewriteEngine on
RewriteCond %{THE_REQUEST} /([^.]+)\.php [NC]
RewriteRule ^ /%1 [NC,L,R]
RewriteCond %{REQUEST_FILENAME}.php -f
RewriteRule ^ %{REQUEST_URI}.php [NC,L]

next save it on root folder same with index. Now html no longer needed.


RewriteEngine on
RewriteCond %{REQUEST_FILENAME} !-d
RewriteCond %{REQUEST_FILENAME}\.php -f
RewriteRule ^(.*)$ $1.php [NC,L]

CSS Target to replace JQuery

Ok.. I just found :target on css.. freaking out!

https://www.w3schools.com/cssref/tryit.asp?filename=trycss3_target_modal
https://www.w3schools.com/cssref/sel_target.asp
https://developer.mozilla.org/en-US/docs/Web/CSS/:target

Add animation on it to make it life

https://css-tricks.com/on-target/

here the full code of mine

https://codepad.co/snippet/WoBwuMB7

Sunday, 24 June 2018

NPM Shown err to much

npm cache clean --force

bye bye

npm install -g npm@latest
npm cache verify
npm i 

Now lets create new json package

npm init --yes

Remove rubbish package inside dependency


npm uninstall rubbish ← this name of the package you want to remove

Now VUEjs can be develop as App by using NativeScript!

https://docs.nativescript.org/vuejs/nativescript-vuejs
https://nativescript-vue.org/en/docs/getting-started/quick-start/

Gosh! This is so cool, why? because I could read vue.js clearly.. now I can make apps using vue!

https://play.nativescript.org/?template=play-vue&id=jy01gX
https://www.youtube.com/watch?v=LDqsuLQqLrQ

Monday, 11 June 2018

Change divi sidebar from right to left

.et_right_sidebar #main-content .container::before{
left: 29% !important;
right: auto !important;
}

body #page-container #left-area{
float: right;
padding-left: 3%;
padding-right: 0;
}

body #page-container #sidebar{
padding-left: 0;
padding-right: 3%;
float: left;
}

Monday, 4 June 2018

Angular : Manually Routing

Step 1: Make sure you have at least 2 Components

Syarat sah untuk bina routing adalah


  • ada sekurang2nya 2 component
  • guna cli dibawah untuk generate component baru


ng generate component about

ng g c about 

Step 2: Create an app.router.ts file

Kemudian dengan mengunakan editor ( VS e.g ) tepek code dibawah

import { ModuleWithProviders } from '@angular/core';
import { Routes, RouterModule } from '@angular/router';

import { AppComponent } from './app.component';
import { AboutComponent } from './about/about.component';
import { ServicesComponent } from './services/services.component';


export const router: Routes = [
    { path: '', redirectTo: 'about', pathMatch: 'full' },
    { path: 'about', component: AboutComponent },
    { path: 'services', component: ServicesComponent }

];

export const routes: ModuleWithProviders = RouterModule.forRoot(router);

Tukarkan code2 ini dengan component anda

import { AppComponent } from './app.component';
import { AboutComponent } from './about/about.component';
import { ServicesComponent } from './services/services.component'; 

Ini pula proses selepas import iaitu tentukan kemana component tu hendak dibawa

export const router: Routes = [
    { path: '', redirectTo: 'about', pathMatch: 'full' },
    { path: 'about', component: AboutComponent },
    { path: 'services', component: ServicesComponent } 

Step 3: Import the router to app.module.ts

Dah buat syarat tu, untuk membolehkan projek berjaya di build mesti dapat kebenaran dari module.ts

import { routes } from './app.router';
letak kat atas

imports: [
    BrowserModule,
    FormsModule,
    HttpModule,
    routes
  ], 
 Jangan lupa letak routes kat bahagian imports, kalau tak dia macam dah siap kerja tapi tak hantar kat lecturer.

Step 4: Add <router-outlet></router-outlet>


di app.component.html, letak:

<router-outlet></router-outlet>

Step 5: Add the routerLink directive

mula letak link kini bukan lagi a href di angular kita guna routerLink kalau dah routing
 <ul class="nav navbar-nav">
  <li>
    <a routerLink="about">About</a>
  </li>
  <li>
    <a routerLink="services">Services</a>
  </li>
</ul>

Step 6: Ensure <base href="/"> is in index.html

Kat index jangan lupa letak <base href="/">

dia mewakili routerLink..

Angular 6 : Project with scss & routing

ng new projName --style=scss --routing

this CLI will automatic add routing and scss

email mailto: pretext

 <a href="mailto:designoutsourced.com+info@gmail.com?subject=Maklumat%20lanjut%20pakej&body=Hai,%20saya%20berminat%20tahu%20lebi...