Forem: zidniryi

Kumpulan Tutorial React Native Bahasa Indonesia

zidniryi — Mon, 06 Apr 2020 11:02:15 +0000

Pada tutorial kali ini saya akan membaut sebuah artikel mengenai React Native, di tutorial sebelumnya saya membuat tutorial selalu berbahasa inggris, namun untuk kali ini saya ingin membuat tutorial dan informasi dalam Bahasa Indonesia.

Kali ini saya ingin membagikan tutorial mengenai React Native, jadi ditutorial ini saya akan memberikan kumpulan link untuk belajar React Native dari tidak tahu sama sekali sampai advanced.

Kumpulan Tutorial React Native Bahasa Indonesia Zero To Advanced

#1 Pengenelan React Native Dan Cara Instalasinya Lengkap

#2 Tutorial React Native State Dan Props Serta Penjelasannya

#3 Tutorial Menampilkan Gambar React Native Yang Baik & Benar

#4 Tutorial React Native Alert, Beserta Jenis-Jenisnya Lengkap

https://www.konsepkoding.com/2020/03/tutorial-clicklistener-pada-react.html

#6 Tutorial React Native: Text Italic, Bold, Underline dan Styling

#7 Tutorial Membuat Custom TextArea Pada React Native

#8 Tutorial React Native Mengubah Warna Pada Placeholder

#9 Tutorial React Native : Advanced Webview Dengan Loader

#10 Tutorial Open Link Url Website Di React Native

#11 Tutorial React Native WhatsApp Direct Send Link

#12 Tutorial React Native Modal Dengan Desain Gambar

#13 Tutorial React Native : React Navigation 5 Untuk Navigasi

#14 Tutorial React Native : Mengirim Data Pada React Navigation

#15 Tutorial React Native Top TabView Gesture Lengkap

#16 Tutorial React Native : Animation JSON Lottie

#17 Tutorial Dan Penjelasan Lifecycle Pada Classes React Native

#18 Tutorial Get API React Native Yang Baik Dengan Axios

#19 Tutorial Get Detail Data React Native Axios Github API

#20 Tutorial Date Time React Native Membuat Aplikasi Stopwatch

#21 Tutorial React Native State Management Redux Lengkap

#22 Tutorial React Native : Redux Thunk Get API

#23 Tutorial In-App Browser Modern Dengan React Native

#24 Tutorial React Native AsyncStorage React Native Lengkap

#25 Tutorial Push Notification Firebase Cloud Messaging React Native V6

#26 Tutorial React Native: Pengenalan React Native Hooks Dan Lifecycle

#27 Tutorial React Native Hooks: Get API Axios

#28 Tutorial React Native: ToastAndroid React Native

#29 Tutorial React Native: Penggunaan Platform Android iOS

#30 Tutorial React Native: Responsive Design UI Login

#31 Tutorial Upload Gambar React Native Ke Server

Yah itu semoga artikel ini dapat bermanfaat dan membantu kamu yang sedang mempelajari React Native. Happy Coding Indonesia.

Advanced Regex With Modern Javascript Complete Guide

zidniryi — Sun, 16 Feb 2020 08:29:45 +0000

What is Regex?

Usually called with Regular Expression , Regexp, or Regex. Regex is a string of text that allows you to create patterns that help match, locate, and manage text.

Regular expressions are a generalized way to match patterns with sequences of characters. It is used in every programming language like C++, Java, Python, Javascript, etc.

Why do we need to use Regex, ok before Regex is very applicable in Front End and Back End.

Regex is useful for filtering text, this is very useful because by using Regex we can choose what characters can enter our server and with regex, we can also filter out a file extension and many more. Ok for more convenience let's do it in this tutorial.

Ok in the introduction in this tutorial we will implement regex using modern javascript using ES6 +.

Ok Before starting this tutorial you can invite your pet like your cat or dog. To walk on your keyboard. LOL.

1. Regex For Number


const regNumber = /^\d*(\.\d+)?$/
const result = '123'.match(regNumber)       // true
if (result) {
    console.log('Match')
} else {
    console.log('Not Match')
}

2. Regex For Match Lowercase


const regexStringSensitive = /[a-z]/g
const result = 'HELLO'.match(regexStringSensitive)
if (result) {
    console.log('True')
} else {
    console.log('False')
}

3. Regex For Match Email


const regexEmail = /^(([^<>()\[\]\\.,;:\s@"]+(\.[^<>()\[\]\\.,;:\s@"]+)*)|(".+"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/
const result = 'helo@gmail.com'.match(regexEmail)
if (result) {
    console.log('Email is Match')
} else {
    console.log('Not Match')
}

4. Regex For Match Some String


const regexMatchString = /(abc|def)[0-9]{8,11}/
const result = 'abc234832748374asdf7943278934haskhjd'.match(regexMatchString)  //if match abc234832748374 it will true
if (result) {
    console.log('Match')
} else {
    console.log('Not Match')
}

5. Regex For Match Multi-Word


const regexMatchLove = /\LOVE|\bLie/
const result = 'I LOVE YOU AND I NOT LIE'.match(regexMatchLove)  // Match with word LOVE and LIE
if (result) {
    console.log('Match Word')
} else {
    console.log('Not Match')
}

6. Regex For Match File Extensions


const regexFileName = /\.(gif|jpg|jpeg|tiff|png)$/i
const result = 'helo.jpg'.match(regexFileName)  // match with filename gif|jpg|jpeg|tiff|png
if (result) {
    console.log('Match File')
} else {
    console.log('Not Match')
}

7. Regex Min Max


const regexMinMax = /^.{8,20}$/
const result = 'helo.jpg 123'.match(regexMinMax)   //min 8 max 20
if (result) {
    console.log('Recomended Password')
} else {
    console.log('Not Recomended Password')
}

8. Regex For Special Character


const regexSpecialCharacter = /[\!\@\#\$\%\^\&\*\)\(\+\=\.\<\>\{\}\[\]\:\;\'\"\|\~\`\_\-]/g
const result = '*( Helo {k. ='.match(regexSpecialCharacter)
if (result) {
    console.log('Contain Special Character')
} else {
    console.log('Not Contain Special Character')
}

Reference for Regex

Any character except [\^$.|?*+()    Literal character
\ followed by any of [\^$.|?*+(){}  Backslash escapes a metacharacter
.   Any character
|   Alternation
\|  Alternation
?   Greedy quantifier
\?  Greedy quantifier
??  Lazy quantifier
?+  Possessive quantifier
*   Greedy quantifier
*?  Lazy quantifier
*+  Possessive quantifier
+   Greedy quantifier
\+  Greedy quantifier
+?  Lazy quantifier
++  Possessive quantifier
{ and } Literal curly braces
{n} where n is an integer >= 1  Fixed quantifier
{n,m} where n >= 0 and m >= n   Greedy quantifier
{n,} where n >= 0   Greedy quantifier
{,m} where m >= 1   Greedy quantifier
\{n\} where n is an integer >= 1    Fixed quantifier
\{n,m\} where n >= 0 and m >= n Greedy quantifier
\{n,\} where n >= 0 Greedy quantifier
\{,m\} where m >= 1 Greedy quantifier
{n,m}? where n >= 0 and m >= n  Lazy quantifier
{n,}? where n >= 0  Lazy quantifier
{,m}? where m >= 1  Lazy quantifier
{n,m}+ where n >= 0 and m >= n  Possessive quantifier
{n,}+ where n >= 0  Possessive quantifier
^   String anchor
^   Line anchor
$   String anchor
$   Line anchor
\a  Character escape
\A  String anchor
\A  Attempt anchor
\b  Word boundary
\b  Backspace character
\B  Word non-boundary
\B  Backslash character
\c  XML shorthand
\ca through \cz Control character escape
\cA through \cZ Control character escape
\C  XML shorthand
\d  Digits shorthand
\D  Non-digits shorthand
\e  Escape character
\f  Form feed character
\g{name}    Named backreference
\g-1, \g-2, etc.    Relative Backreference
\g{-1}, \g{-2}, etc.    Relative Backreference
\g1 through \g99    Backreference
\g{1} through \g{99}    Backreference
\g<name> where “name” is the name of a capturing group  Named subroutine call
\g<name> where “name” is the name of a capturing group  Named backreference
\g'name' where “name” is the name of a capturing group  Named subroutine call
\g'name' where “name” is the name of a capturing group  Named backreference
\g<0>   Recursion
\g'0'   Recursion
\g<1> where 1 is the number of a capturing group    Subroutine call
\g<1> where 1 is the number of a capturing group    Backreference
\g'1' where 1 is the number of a capturing group    Subroutine call
\g'1' where 1 is the number of a capturing group    Backreference
\g<-1> where -1 is a negative integer   Relative subroutine call
\g<-1> where -1 is a negative integer   Relative backreference
\g'-1' where -1 is a negative integer   Relative subroutine call
\g'-1' where -1 is a negative integer   Relative backreference
\g<+1> where +1 is a positive integer   Forward subroutine call
\g'+1' where +1 is a positive integer   Forward subroutine call
\G  Attempt anchor
\G  Match anchor
\h  Hexadecimal digit shorthand
\h  Horizontal whitespace shorthand
\H  Non-hexadecimal digit shorthand
\H  Non-horizontal whitespace shorthand
\i  XML shorthand
\I  XML shorthand
\k<name>    Named backreference
\k'name' through \k'99' Named backreference
\k{name}    Named backreference
\k<1> through \k<99>    Backreference
\k'1' through \k'99'    Backreference
\k<-1>, \k<-2>, etc.    Relative Backreference
\k'-1', \k'-2', etc.    Relative Backreference
\K  Keep text out of the regex match
\l  Lowercase shorthand
\L  Non-lowercase shorthand
\m  Tcl start of word boundary
\M  Tcl end of word boundary
\n  Line feed character
\N  Not a line break
Literal CRLF, LF, or CR line break  Line break
\o{7777} where 7777 is any octal number Octal escape
\pL where L is a Unicode category   Unicode category
\PL where L is a Unicode category   Unicode category
\p{L} where L is a Unicode category Unicode category
\p{IsL} where L is a Unicode category   Unicode category
\p{Category}    Unicode category
\p{IsCategory}  Unicode category
\p{Script}  Unicode script
\p{IsScript}    Unicode script
\p{Block}   Unicode block
\p{InBlock} Unicode block
\p{IsBlock} Unicode block
\P{Property}    Negated Unicode property
\p{^Property}   Negated Unicode property
\P{^Property}   Unicode property
\Q…\E Escape sequence
\r  Carriage return character
\R  Line break
\s  Whitespace shorthand
\S  Non-whitespace shorthand
\t  Tab character
\u  Uppercase shorthand
\uFFFF where FFFF are 4 hexadecimal digits  Unicode code point
\u{FFFF} where FFFF are 1 to 4 hexadecimal digits   Unicode code point
\U  Non-uppercase shorthand
\v  Vertical tab character
\v  Vertical whitespace shorthand
\V  Non-vertical whitespace shorthand
\w  Word character shorthand
\W  Non-word character shorthand
\xFF where FF are 2 hexadecimal digits  Hexadecimal escape
\xFFFF where FFFF are 4 hexadecimal digits  Unicode code point
\x{FFFF} where FFFF are 1 to 4 hexadecimal digits   Unicode code point
\X  Unicode grapheme
\y  Tcl word boundary
\Y  Tcl word non-boundary
\Z  String anchor
\z  String anchor
\0  NULL escape
\1 through \7   Octal escape
\1 through \9   Backreference
\10 through \77 Octal escape
\10 through \99 Backreference
\100 through \377   Octal escape
\01 through \0377   Octal escape
\‘    String anchor
\‘    Attempt anchor
\'  String anchor
\<  GNU word boundary
\>  GNU word boundary
[[:<:]] POSIX word boundary
[[:>:]] POSIX word boundary
(regex) Capturing group
\(regex\)   Capturing group
(?:regex)   Non-capturing group
(?<name>regex)  Named capturing group
(?'name'regex)  Named capturing group
(?#comment) Comment
(?|regex)   Branch reset group
(?>regex)   Atomic group
(?=regex)   Positive lookahead
(?!regex)   Negative lookahead
(?<=regex)  Positive lookbehind
(?<!regex)  Negative lookbehind
(?(?=regex)then|else) where (?=regex) is any valid lookaround and then and else are any valid regexes   Lookaround conditional
(?(regex)then|else) where regex, then, and else are any valid regexes and regex is not the name of a capturing group    Implicit lookahead conditional
(?(name)then|else) where name is the name of a capturing group and then and else are any valid regexes  Named conditional
(?(<name>)then|else) where name is the name of a capturing group and then and else are any valid regexes    Named conditional
(?('name')then|else) where name is the name of a capturing group and then and else are any valid regexes    Named conditional
(?(1)then|else) where 1 is the number of a capturing group and then and else are any valid regexes  Conditional
(?(-1)then|else) where -1 is a negative integer and then and else are any valid regexes Relative conditional
(?(+1)then|else) where +1 is a positive integer and then and else are any valid regexes Forward conditional
(?(+1)then|else) where 1 is the number of a capturing group and then and else are any valid regexes Conditional
(?<capture-subtract>regex) where “capture” and “subtract” are group names and “regex” is any regex  Balancing group
(?'capture-subtract'regex) where “capture” and “subtract” are group names and “regex” is any regex  Balancing group
(?&name) where “name” is the name of a capturing group  Named subroutine call
(?(DEFINE)regex) where “regex” is any regex Subroutine definitions
(?P<name>regex) Named capturing group
(?P=name)   Named backreference
(?P=1) through (?P=99)  Backreference
(?P>name) where “name” is the name of a capturing group Named subroutine call
(?R)    Recursion
(?0)    Recursion
(?1) where 1 is the number of a capturing group Subroutine call
(?-1) where -1 is a negative integer    Relative subroutine call
(?+1) where +1 is a positive integer    Forward subroutine call

Now that above is the Regular Expression that is most widely used by programmers to filter characters. Please develop it with your needs. It may be useful.

source: www.regular-expressions.info

Dart Vader, Cheatsheet For complete fundamentals of DART Language

zidniryi — Wed, 22 Jan 2020 13:32:07 +0000

Hello, world ?. Ok on this occasion I will share a cheat sheet for those of you who want to learn the DART Programming Language or want to learn Flutter.

1. The First lesson (Hello World By Force)

// Lesson 1 in dart we must wrapper our code in the main
void main() {
  for (int i = 0; i < 7; i++) {
    print('Hello, World ${i + 1}');
  }
}

2. The Second lesson (Function In Dart Side)

// Define the basic function
// Call the parameter
printNumber(num whichNumber) {
  print('The number is $whichNumber');
}

// Calll on main  function dart
void main() {
  var num = 11;
  printNumber(num);
}

3. The Third lesson (Declare War in Dart)

//How to declare variables on Dart
void main() {
  int age = 20; //This is for declare number
  String name = 'John Doe'; //This is string
  bool isMale = true;
  double height = 168.8;

  // Final type
  const data = 'This is final data';
  final gender = 'Male';

// Common variable
  var country = 'Indonesia';

//  List is synonym with an Array
  var list = [1, 2, 3];

//  Maps is synonym with an Object
  var profile = {
    // A map literal
    // Keys       Values
    'firstName': 'zidni',
    'lasNam': 'ridwan nulmuarif',
    'gender': 'male'
  };
// Print here for test the variables
  print(profile);
}

4. The Fourth lesson (More Function In Dart Spirit)

void main() {
  int num1 = 12;
  int num2 = 8;
  printNumber(num1, num2);

  //Call function 2 (We looping the data)
  var list = [1, 2, 3];
  list.forEach(printElement);

  //Call the function 3
  var add2 = makeAdder(2); // Create a function that adds 2.
  var add4 = makeAdder(4); // Create a function that adds 4.
  assert(add2(3) == 5);
  assert(add4(3) == 7);
}

// function 1
void printNumber(num number1, number2) {
  print(number1 + number2);
}

// function 2
printElement(element) {
  print(element);
}

//Function 3
Function makeAdder(num n) {
  return (num i) => n + i;
}

5. The Fifth lesson (Operator is Weapon)

// Operator on Dart
// unary postfix and argument definition test expr++ expr-- () [] . ?identifier
// unary prefix multiplicative
// additive
// shift
// relational and type test equality
// bitwise AND bitwise XOR bitwise OR logical AND logical OR conditional cascade assignment
// -expr !expr ~expr ++expr --expr * / % ~/
// + -
// << >>
// >= > <= == !=
// &
// ^
// < as
// is is!
// |
// &&
// ||
// expr1 ? expr2 : expr3
// .. =*=/=~/=%=+=-=<<=>>=&=^=|=

void main() {
  var z = 2;
  print(z + z);
  print(z / z);
  print(z * z);
  print(z - z);
  print(z = z);
  print(z != z);
  print(z % z);
  print(z < z);
  print(z > z);
  print(z >= z);
  print(z <= z);
  print(z | z);
}

6. Sixth lesson (Control Your Mind)

// Control Flow

void main() {
  // if else
  bool hasRedHair = true;
  if (hasRedHair) {
    print('Erope');
  } else {
    print('Asia, Africa');
  }

// For loop
  var listData = [1, 2, 3, 4, 5];
  for (var x in listData) {
    print(x);
  }

// While and Do-While
  int number = 0;
  do {
    if (number % 2 == 0) {
      print(number);
    }
    number++;
  } while (number < 10);

  // Switch Case
  var command = 'OPEN';
  switch (command) {
    case 'CLOSED':
      print('Please Open The Door');
      break;
    case 'PENDING':
      print('Door Will Be Open');
      break;
    case 'OPEN':
      print('Door Already Open');
      break;
    case 'DENIED':
      print('You Can`t in because Door is lock');
  }
}

7. The Seventh lesson (Assert You're Dream)

// Use an assert statement to disrupt normal execution if a boolean condition is false.
// You can find examples of assert statements throughout this tour. Here are some more:
void main() {
  String text = 'May the force be with you!';
  assert(text != null);
}

8. The Eighth lesson (Exceptions in goodness)

//  Dart code can throw and catch exceptions. Exceptions are errors indicating that something unexpected happened.
void main() {
  int x = 11;
  int y = 0;
  int res;
  try {
    res = x ~/ y;
  } on IntegerDivisionByZeroException {
    print('Cannot divide by zero');
  }
  exception();
  exceptionWithFinaly();
}

// Try catch with exception
exception() {
  int x = 10;
  int y = 0;
  int res;

  try {
    res = x ~/ y;
  } catch (e) {
    print(e);
  }
}

// With finaly
exceptionWithFinaly() {
  int x = 9;
  int y = 0;
  int res;

  try {
    res = x ~/ y;
  } on IntegerDivisionByZeroException {
    print('Cannot divide by zero');
  } finally {
    print('Finally block executed');
  }
}

9. The Ninth lesson (Classes and Universe Objects)

// Structure of Class in Dart
// class class_name {
//    <fields>
//    <getters/setters>
//    <constructors>
//    <functions>
// }

// Fields − A field is any variable declared in a class. Fields represent data pertaining to objects.
// Setters and Getters − Allows the program to initialize and retrieve the values of the fields of a class. A default getter/ setter is associated with every class. However, the default ones can be overridden by explicitly defining a setter/ getter.
// Constructors − responsible for allocating memory for the objects of the class.
// Functions − Functions represent actions an object can take. They are also at times referred to as methods.
void main() {
  Car c = new Car();
  c.desc();
}

class Car {
  // field
  String engine = "B1001";
  String brand = "Ferari";
  String owner = "Zidniryi";
  int yearProd = 2025;
  bool isColorRed = true;

  // function or we can call Method
  void desc() {
    print(engine);
    print(brand);
    print(owner);
    print(yearProd);
    print(isColorRed);
  }
}

10. The Tenth lesson (RegEx the Jedi)

/**
 * A regular expression (regex or regexp for short) is 
 * a special text string for describing a search pattern.
 *  You can think of regular expressions as wildcards on steroids. 
 */

void main() {
  RegExp re = new RegExp(r'(\w+)');
  String str1 = "one two three";
  print('Has match: ${re.hasMatch(str1)}');
  // First match
  Match firstMatch = re.firstMatch(str1);
  print('First match: ${str1.substring(firstMatch.start, firstMatch.end)}');

  //  Iterate all matches
  Iterable matches = re.allMatches(str1);
  matches.forEach((match) {
    print(str1.substring(match.start, match.end));
  });
}

11. The Eleventh lesson (List The Sith)

void main() {
  // Use a List constructor.
  // Or simply use a list literal.
  var fruits = ['apples', 'oranges'];
  // Add to a list.
  fruits.add('kiwis');
  print(fruits);
  print(fruits.length);

  // Add multiple items to a list.
  fruits.addAll(['grapes', 'bananas']);
  print(fruits);

  // Get the list length.
  assert(fruits.length == 5);
  // Remove a single item.
  var appleIndex = fruits.indexOf('apples');
  fruits.removeAt(appleIndex);

  assert(fruits.length == 4);
  print(fruits);
  // Remove all elements from a list.
  fruits.clear();
  assert(fruits.length == 0);
  print(fruits);
}

12. The Twelfth lesson (Date of Yoda)

import 'package:moment/moment.dart';
//For install pubsec.yaml 
//you can see in here => https://dart.dev/tools/pub/pubspec
void main() {
  var now = new DateTime.now();
  var berlinWallFell = new DateTime.utc(1989, 11, 9);
  var moonLanding = DateTime.parse("1969-07-20 20:18:04Z");
  print(now);
  print(moonLanding);
  Moment().add(1, Unit.day);
  var dateStyle = Moment().format('yyyy-MM-dd');
  print(dateStyle);

  print(Moment().subtract(2, Unit.day));
}
}

13. The Thirteenth lesson (Asynchronous Future )

Future<void> getUser() {
  return Future.delayed(Duration(seconds: 3), () => print('Big Data'));
}

void main() {
  getUser();
  print('Fetching user data...');
}

14. The Fourteenth lesson (Asynchronous Future Next Level)

import 'dart:io';

void main() {
  print("Enter your name :");

  // prompt for user input
  String name = stdin.readLineSync();

  // this is a synchronous method that reads user input
  print("Hello Mr. ${name}");
  print("End of main");
}

15. The Fifteenth lesson (Math Attack Clone)

import "dart:math" show pi;

void main() {
  print(pi / 12);
}
}

16. The Sixteenth lesson (Make Lib And Call Skywalker)

// We create library
dart_lib(num1, num2) {
  print(num1 + num2);
}

// We call the library
import '16.0dart_lib.dart';

void main() {
  // call that
  dart_lib(20, 20);
}

That's all for the lesson 😈😈😈😈😇😇😇. May The Force Be With You ...

For clone, You can clone in my GitHub : https://github.com/zidniryi/Dart-Vader