Merge e39a183086 into 0931c8fc67

Add Comprehensive MySQL Commands to Cheatsheet

README.md

@@ -70,6 +70,7 @@ Feel free to take a look. You might learn new things. They have been designed to
 
 - [HTML5](frontend/html5.html)
 - [CSS3](frontend/css3.css)
+- [SCSS](frontend/scss.scss)
 
 #### Frameworks
 

databases/mysql.sh

@@ -16,3 +16,69 @@ GRANT ALL PRIVILEGES ON prospectwith.* TO 'power'@'localhost' WITH GRANT OPTION;
 CREATE USER 'newuser'@'localhost' IDENTIFIED BY 'password'; # Create user
 
 mysql -u root -pmypassword -e "MY SQL QUERY" &>> query.log & disown # Run SQL query in the background
+
+# *****************************************************************************
+# Database and Table Operations
+# *****************************************************************************
+
+CREATE DATABASE database_name; # Create a new database
+DROP DATABASE database_name; # Delete a database
+CREATE TABLE table_name (column1 datatype, column2 datatype, ...); # Create a new table
+DROP TABLE table_name; # Delete a table
+SHOW TABLES; # Display all tables in the current database
+DESCRIBE table_name; # Show the structure of a table
+
+# *****************************************************************************
+# Data Manipulation
+# *****************************************************************************
+
+INSERT INTO table_name (column1, column2, ...) VALUES (value1, value2, ...); # Insert data into a table
+UPDATE table_name SET column1 = value1, column2 = value2, ... WHERE condition; # Update existing data in a table
+DELETE FROM table_name WHERE condition; # Delete data from a table
+SELECT column1, column2, ... FROM table_name WHERE condition; # Select data from a table
+
+# *****************************************************************************
+# Backup and Restore
+# *****************************************************************************
+
+mysqldump -u username -p database_name table1 table2 > file.sql # Backup specific tables
+mysql -u username -p database_name < file.sql # Restore specific tables
+
+# *****************************************************************************
+# User Management and Security
+# *****************************************************************************
+
+REVOKE privilege_type ON database_name.table_name FROM 'username'@'hostname'; # Revoke privileges from a user
+DROP USER 'username'@'hostname'; # Delete a user
+ALTER USER 'username'@'hostname' IDENTIFIED BY 'newpassword'; # Reset a user's password
+
+# *****************************************************************************
+# Performance and Maintenance
+# *****************************************************************************
+
+OPTIMIZE TABLE table_name; # Optimize a table
+ANALYZE TABLE table_name; # Analyze a table for key distribution and storage optimization
+CHECK TABLE table_name; # Check a table for errors
+REPAIR TABLE table_name; # Repair a corrupted table
+
+# *****************************************************************************
+# Advanced Queries
+# *****************************************************************************
+
+SELECT ... FROM table1 JOIN table2 ON table1.column = table2.column; # Perform a join operation between two tables
+SELECT ... FROM (SELECT ... FROM table_name) AS subquery; # Use a subquery within another query
+SELECT column, COUNT(*) FROM table_name GROUP BY column; # Group results and use aggregate functions
+
+# *****************************************************************************
+# System Information
+# *****************************************************************************
+
+SELECT VERSION(); # Show the current version of MySQL
+SELECT User, Host FROM mysql.user; # List all current MySQL users
+
+# *****************************************************************************
+# Miscellaneous
+# *****************************************************************************
+
+SET GLOBAL general_log = 'ON'; # Enable query logging
+SHOW FULL PROCESSLIST; # Show the last queries executed in MySQL

frontend/scss.scss

@@ -0,0 +1,442 @@
+/****************************
+ * SCSS CHEATSHEET
+ * Documentation: https://sass-lang.com/documentation/
+ *
+ *
+ * Table of contents
+ * -----------------
+ *  01 | Variables
+ *  02 | Nesting
+ *  03 | Interpolation
+ *  04 | Operators
+ *  05 | At-Rules
+ *        - @use
+ *        - @include
+ *        - @extend
+ *        - @function
+ *        - @mixin and @include
+ *        - @if
+ *        - @else and @else if
+ *        - @for
+ *        - @each
+ *        - @while
+ *****************************/
+
+/***************************
+
+------------ 01: Variables -----------
+
+You can define variables in SCSS using the $ symbol as prefix and assign a value.
+We can then refer this variable anywhere instead of the value in the SCSS file.
+This helps in reducing repetition and makes it easier to update the value in one place.
+
+*******************************/
+// $success-color and $error-color are variables defined with color values
+
+$success-color: #56c0a4;
+$error-color: #ff5b5b;
+
+.success-notification {
+  color: $success-color;
+}
+
+.error-notification {
+  color: $error-color;
+}
+
+.valid {
+  background-color: $success-color;
+}
+
+.invalid {
+  background-color: $error-color;
+}
+
+/*** CSS Output ***/
+
+.success-notification {
+  color: #56c0a4;
+}
+
+.error-notification {
+  color: #ff5b5b;
+}
+
+.valid {
+  background-color: #56c0a4;
+}
+
+.invalid {
+  background-color: #ff5b5b;
+}
+
+/***************************
+
+------------ 02: Nesting -----------
+
+SCSS allows you to nest your CSS selectors in a way that follows the same visual hierarchy of your HTML.
+
+<div class="container">
+  <h1 class="header">Title</h1>
+  <p class="content">Content 1</p>
+  <p class="content">Content 2</p>
+</div>
+
+*******************************/
+
+.container {
+  width: 100%;
+  .header {
+    font-size: 24px;
+  }
+  .content {
+    font-size: 16px;
+  }
+}
+
+/*** CSS Output ***/
+
+.container {
+  width: 100%;
+}
+.container .header {
+  font-size: 24px;
+}
+.container .content {
+  font-size: 16px;
+}
+
+/***************************
+
+------------ 03: Interpolation -----------
+
+Interpolation is a way to embed a variable value into a string. It is done using the #{} syntax.
+Below is just a simple example, you can see better practical usages of interpolation in the At-Rules section.
+
+*******************************/
+$element: 'p';
+
+#{$element} {
+  color: #e0ffff;
+}
+
+/*** CSS Output ***/
+
+p {
+  color: #e0ffff;
+}
+
+/***************************
+
+------------ 04: Operators ------------
+We can use operators in SCSS to perform arithmetic operations.
+
+*******************************/
+
+$padding: 4px;
+$font-size: 2rem;
+
+.header {
+  padding: $padding * 2;
+  font-size: $font-size + 2;
+}
+
+.para {
+  padding: calc($padding / 2);
+  font-size: $font-size - 1;
+}
+
+/*** CSS Output ***/
+
+.header {
+  padding: 8px;
+  font-size: 4rem;
+}
+
+.para {
+  padding: 2px;
+  font-size: 1rem;
+}
+
+/***************************
+
+------------ 05: At-Rules -----------
+
+At-Rules are special instructions to the SCSS preprocessor. They are prefixed with the @ symbol.
+
+*******************************/
+
+// @use
+
+// @use is a directive in SCSS that replaces @import and provides better control over how you import and use code from other stylesheets.
+// Assume we have a file named _variables.scss
+
+// _variables.scss
+$containerWidth: 100px;
+$cardHeight: 60px;
+
+@function doubleWidth($width) {
+  @return $width * 2;
+}
+
+// We can use the variables defined in _variables.scss in our main SCSS file as follows:
+
+@use 'variables' as v;
+
+.container {
+  width: v.doubleWidth(v.$containerWidth); // 200px
+}
+
+.card {
+  height: v.$cardHeight; // 60px
+}
+
+// @extend
+
+// @extend is used to inherit styles from another selector.
+
+.error {
+  border: 1px solid red;
+}
+
+.error-notification {
+  @extend .error;
+  background-color: #ff5b5b;
+}
+
+/*** CSS Output ***/
+
+.error,
+.error-notification {
+  border: 1px solid red;
+}
+
+.error-notification {
+  background-color: #ff5b5b;
+}
+
+/*****************/
+
+// @function
+
+// @function is used to define a function in SCSS to perform operations and return a value.
+
+$spacing: 4px;
+
+@function spacing($value) {
+  @return $value * $spacing;
+}
+
+.container {
+  padding: spacing(4);
+}
+
+/*** CSS Output ***/
+
+.container {
+  padding: 16px;
+}
+/*****************/
+
+// @mixin and include
+
+// @mixin is used to define a mixin in SCSS to reuse styles.
+// @include is used to include a mixin in the current selector.
+
+// $color is a parameter with a default value of #000, when not passed it defaults to #000
+@mixin border-radius($radius, $color: #e82b2b) {
+  border-radius: $radius;
+  color: $color;
+}
+
+.button-primary {
+  @include border-radius(4px, #56c0a4);
+}
+
+.button-secondary {
+  @include border-radius(4px);
+}
+
+/*** CSS Output ***/
+
+.button-primary {
+  border-radius: 4px;
+  color: #56c0a4;
+}
+
+.button-secondary {
+  border-radius: 4px;
+  color: #e82b2b; // default value
+}
+/*****************/
+
+// @if
+
+// @if is used to conditionally apply styles.
+// In the below example, if the value of $progress is greater than or equal to 80, the green background-color will be added.
+
+@mixin show-progress($progress: 0) {
+  @if $progress >= 80 {
+    background-color: green;
+  }
+  color: #ffffff;
+}
+
+.progress-bar-1 {
+  @include show-progress(90);
+}
+
+.progress-bar-2 {
+  @include show-progress();
+}
+
+/*** CSS Output ***/
+
+.progress-bar-1 {
+  background-color: green;
+  color: #ffffff;
+}
+
+.progress-bar-2 {
+  color: #ffffff;
+}
+/*****************/
+
+// @else
+
+// @else and @else if are used to define alternative conditions for @if.
+
+@mixin show-progress($progress: 0) {
+  @if $progress >= 80 {
+    background-color: green;
+  } @else if $progress >= 40 {
+    background-color: orange;
+  } @else {
+    background-color: red;
+  }
+  color: #ffffff;
+}
+
+.progress-bar-1 {
+  @include show-progress(90);
+}
+
+.progress-bar-2 {
+  @include show-progress(40);
+}
+
+.progress-bar-3 {
+  @include show-progress();
+}
+
+/*** CSS Output ***/
+
+.progress-bar-1 {
+  background-color: green;
+  color: #ffffff;
+}
+
+.progress-bar-2 {
+  background-color: orange;
+  color: #ffffff;
+}
+
+.progress-bar-3 {
+  background-color: red;
+  color: #ffffff;
+}
+/*****************/
+
+// @for
+
+// @for is used to loop through a range of values.
+
+@for $i from 1 through 3 {
+  .item-#{$i} {
+    // Interpolation to create class names item-1, item-2, item-3
+    padding: 4px * $i;
+  }
+}
+
+/*** CSS Output ***/
+
+.item-1 {
+  padding: 4px;
+}
+
+.item-2 {
+  padding: 8px;
+}
+
+.item-3 {
+  padding: 12px;
+}
+/*****************/
+
+// @each
+
+// @each is used to loop through a list of values.
+
+$statuses: (
+  'success': 'green',
+  'warn': 'orange',
+  'error': 'red',
+);
+
+@each $type, $color in $statuses {
+  .#{$type} {
+    color: $color;
+  }
+}
+
+/*** CSS Output ***/
+
+.success {
+  color: 'green';
+}
+
+.warn {
+  color: 'orange';
+}
+
+.error {
+  color: 'red';
+}
+/*****************/
+
+// @while
+
+// @while is used to loop through a block of code while a condition is true.
+
+$i: 5;
+
+@while $i > 0 {
+  .item-#{$i} {
+    background-color: rgba(255, 0, 0, $i * 0.1);
+  }
+  $i: $i - 1;
+}
+
+/*** CSS Output ***/
+
+.item-5 {
+  background-color: rgba(255, 0, 0, 0.5);
+}
+
+.item-4 {
+  background-color: rgba(255, 0, 0, 0.4);
+}
+
+.item-3 {
+  background-color: rgba(255, 0, 0, 0.3);
+}
+
+.item-2 {
+  background-color: rgba(255, 0, 0, 0.2);
+}
+
+.item-1 {
+  background-color: rgba(255, 0, 0, 0.1);
+}
+
+/****************************************************************/

tools/vim.txt

@@ -20,13 +20,15 @@ e                   jump to end of words (punctuation considered words)
 E                   jump to end of words (no punctuation)
 b                   jump backward by words (punctuation considered words)
 B                   jump backward by words (no punctuation)
-ge                  jump backward to end of words
+ge                  jump backward to end of a word
+gE                  jump backwards to the end of a word (words can contain punctuation)
 0                   (zero) start of line
 ^                   first non-blank character of line
-$                   end of line
--                   move line upwards, on the first non blank character
-+                   move line downwards, on the first non blank character
-<enter>             move line downwards, on the first non blank character
+$                   jump to the end of the line
+g_                  jump to the last non-blank character of the line
+-                   move line upwards, on the first non-blank character
++                   move line downwards, on the first non-blank character
+<enter>             move line downwards, on the first non-blank character
 gg                  go to first line
 G                   go to last line
 ngg                 go to line n
@@ -38,10 +40,6 @@ nG                  go To line n
 }                   move the cursor a paragraph forwards
 ]]                  move the cursor a section forwards or to the next {
 [[                  move the cursor a section backwards or the previous {
-CTRL-f              move the cursor forward by a screen of text
-CTRL-b              move the cursor backward by a screen of text
-CTRL-u              move the cursor up by half a screen
-CTRL-d              move the cursor down by half a screen
 H                   move the cursor to the top of the screen.
 M                   move the cursor to the middle of the screen.
 L                   move the cursor to the bottom of the screen.
@@ -49,6 +47,16 @@ fx                  search line forward for 'x'
 Fx                  search line backward for 'x'
 tx                  search line forward before 'x'
 Tx                  search line backward before 'x'
+CTRL-y              moves screen up one line
+CTRL-e              moves screen down one line
+CTRL-u              moves cursor & screen up ½ page
+CTRL-d              moves cursor & screen down ½ page
+CTRL-b              moves screen up one page, cursor to last line
+CTRL-f              moves screen down one page, cursor to first line
+zz                  shift current line to middle of screen
+z.                  same as zz but also jumps to the first non-black character
+zt                  shift current line to top of screen
+zb                  shift current line to bottom of screen
 
 
 ##############################################################################
@@ -60,8 +68,15 @@ Tx                  search line backward before 'x'
 ma                  make a bookmark named a at the current cursor position
 `a                  go to position of bookmark a
 'a                  go to the line with bookmark a
+`0                  go to the position where Vim was previously exited
+`"                  go to the position when last editing this file
 `.                  go to the line that you last edited
+``                  go to the position before the last jump
+g,                  go to newer position in change list
+g;                  go to older position in change list
 
+# Tip: To jump to a mark you can either use a backtick (`) or an apostrophe (').
+# Using an apostrophe jumps to the beginning (first non-blank) of the line holding the mark.
 
 ##############################################################################
 # INSERT MODE
@@ -70,10 +85,13 @@ ma                  make a bookmark named a at the current cursor position
 
 i                   start insert mode at cursor
 I                   insert at the beginning of the line
+gi                  return to insert mode where you inserted text the last time
+gI                  like "I", but always start in column 1
 a                   append after the cursor
 A                   append at the end of the line
 o                   open (append) blank line below current line
 O                   open blank line above current line
+CTRL-o              Temporarily enter normal mode to issue one normal-mode command(while in insert mode)
 Esc                 exit insert mode
 
 
@@ -84,10 +102,25 @@ Esc                 exit insert mode
 
 r                   replace a single character (does not use insert mode)
 R                   enter Insert mode, replacing characters rather than inserting
-J                   join line below to the current one
+J                   join line below to the current one with one space in between
+gJ                  join line below to the current one without space in between
 cc                  change (replace) an entire line
-cw                  change (replace) to the end of word
-C                   change (replace) to the end of line
+cw                  change (replace) to the end of word (same as ce)
+2cw                 change (replace) repeat cw twice
+ciw                 change (replace) word under the cursor
+caw                 change (replace) word under the cursor and the space after or before it
+ci"                 change (replace) word inside ""
+cit                 change (replace) html tag content
+cat                 change (replace) html tag
+cis                 change (replace) sentence under the cursor
+cas                 change (replace) sentence under the cursor and the space after or before it
+cib                 change (replace) inside a block with ()
+cab                 change (replace) a block with ()
+ciB                 change (replace) inside a block with {}
+caB                 change (replace) a block with {}
+C                   change (replace) to the end of line(same as c$)
+cG                  change (replace) to the end of the file
+cgg                 change (replace) from first line to current line
 ct'                 change (replace) until the ' character (can change ' for any character)
 s                   delete character at cursor and substitute text
 S                   delete line at cursor and substitute text (same as cc)
@@ -102,6 +135,7 @@ guiw                make current word lowercase
 gU$                 make uppercase until end of line
 gu$                 make lowercase until end of line
 >>                  indent line one column to right
+>i{                 indent everything in the {}
 <<                  indent line one column to left
 ==                  auto-indent current line
 ddp                 swap current line with next
@@ -110,6 +144,7 @@ ddkP                swap current line with previous
 :r [name]           insert the file [name] below the cursor.
 :r !{cmd}           execute {cmd} and insert its standard output below the cursor.
 
+# Tip: Instead of b or B one can also use ( or { respectively.
 
 ##############################################################################
 # DELETING TEXT
@@ -118,10 +153,15 @@ ddkP                swap current line with previous
 
 x                   delete current character
 X                   delete previous character
-dw                  delete the current word
+dw                  delete (cut) to the end of word (same as de)
+diw                 delete (cut) word under the cursor
+daw                 delete (cut) word under the cursor and the space after or before it
+dap                 delete (cut) a paragraph
 dd                  delete (cut) a line
-dt'                 delete until the next ' character on the line (replace ' by any character)
-D                   delete from cursor to end of line
+dt'                 delete (cut) until the next ' character on the line (replace ' by any character)
+dG                  delete (cut) to the end of the file
+dgg                 delete (cut) from first line to current line
+D                   delete (cut) from cursor to end of line (same as d$)
 :[range]d           delete [range] lines
 
 
@@ -136,6 +176,10 @@ yy                  yank (copy) a line
 y$                  yank to end of line
 p                   put (paste) the clipboard after cursor/current line
 P                   put (paste) before cursor/current line
+gp                  put (paste) the clipboard after cursor and leave cursor after the new text
+gP                  put (paste) before cursor and leave cursor after the new text
+"+y                 yank into the system clipboard register
+"+p                 paste from the system clipboard register
 :set paste          avoid unexpected effects in pasting
 :registers          display the contents of all registers
 "xyw                yank word into register x
@@ -147,6 +191,12 @@ P                   put (paste) before cursor/current line
 "xgP                just like "P", but leave the cursor just after the new text
 :[line]put x        put the text from register x after [line]
 
+# Tip: if you are using vim extension on vs code, you can enable
+"vim.useSystemClipboard": true
+in setting.json, this will allow to Use system clipboard for unnamed register.
+
+
+
 
 ##############################################################################
 # MACROS
@@ -157,6 +207,7 @@ qa                  start recording macro 'a'
 q                   end recording macro
 @a                  replay macro 'a'
 @:                  replay last command
+@@                  repeat macro
 
 
 ##############################################################################
@@ -172,9 +223,11 @@ CTRL-v              start visual block mode
 O                   move to other corner of block
 aw                  mark a word
 ab                  a () block (with braces)
-ab                  a {} block (with brackets)
+aB                  a {} block (with brackets)
+at                  a block with <> tags
 ib                  inner () block
-ib                  inner {} block
+iB                  inner {} block
+it                  inner <> block
 Esc                 exit visual mode
 
 VISUAL MODE COMMANDS
@@ -194,6 +247,7 @@ v%                  selects matching parenthesis
 vi{                 selects matching curly brace
 vi"                 selects text between double quotes
 vi'                 selects text between single quotes
+gv                  reselect the last selected area
 
 ##############################################################################
 # SPELLING
@@ -283,7 +337,6 @@ CTRL-w <            increase window width
 CTRL-w >            decrease window width
 CTRL-w =            equal window
 CTRL-w o            close other windows
-zz                  Centers the window to the current line
 
 
 ##############################################################################
@@ -306,12 +359,14 @@ clast               display the last error
 
 
 %                   show matching brace, bracket, or parenthese
-gf                  edit the file whose name is under or after the cursor
+gf                  edit the file whose name is under the cursor
+gF                  edit the file whose name is under the cursor and jump to the line number
 gd                  when the cursor is on a local variable or function, jump to its declaration
 ''                  return to the line where the cursor was before the latest jump
-gi                  return to insert mode where you inserted text the last time
 CTRL-o              move to previous position you were at
 CTRL-i              move to more recent position you were at
+:set nu             display numbers (short for :set number)
+:set nonu           hide numbers (short for :set nonumber)
 
 
 ##############################################################################