==================================================CHECKBOX-==============
<section title=".squaredOne">
<!-- .squaredOne -->
<div class="squaredOne">
<input type="checkbox" value="None" id="squaredOne" name="check" checked />
<label for="squaredOne"></label>
</div>
<!-- end .squaredOne -->
</section>
@import 'compass/css3';
/* $activeColor: #c0392b; //red */
$activeColor: #27ae60; //green
$darkenColor: darken($activeColor, 20%);
/* $background: url('https://s3-us-west-2.amazonaws.com/s.cdpn.io/13460/dark_wall.png'); */
$background: #3498db;
.squaredOne {
width: 28px;
height: 28px;
position: relative;
margin: 20px auto;
background: #fcfff4;
background: linear-gradient(top, #fcfff4 0%, #dfe5d7 40%, #b3bead 100%);
box-shadow: inset 0px 1px 1px white, 0px 1px 3px rgba(0, 0, 0, 0.5);
label {
width: 20px;
height: 20px;
position: absolute;
top: 4px;
left: 4px;
cursor: pointer;
background: linear-gradient(top, #222 0%, #45484d 100%);
box-shadow: inset 0px 1px 1px rgba(0, 0, 0, 0.5), 0px 1px 0px rgba(255, 255, 255, 1);
&:after {
content: '';
width: 16px;
height: 16px;
position: absolute;
top: 2px;
left: 2px;
background: $activeColor;
background: linear-gradient(top, $activeColor 0%, $darkenColor 100%);
box-shadow: inset 0px 1px 1px white, 0px 1px 3px rgba(0, 0, 0, 0.5);
opacity: 0;
}
&:hover::after {
opacity: 0.3;
}
}
input[type='checkbox'] {
visibility: hidden;
&:checked + label:after {
opacity: 1;
}
}
}
$(document).ready(function () {
// Hide the border by commenting out the variable below
const $on = 'section';
$($on).css({
background: 'none',
border: 'none',
'box-shadow': 'none',
});
});
============================================================================ ========================================== ORDERS ========================
// Π€ΡΠ½ΠΊΡΠΈΡ order() ΠΎΡΠΎΠ±ΡΠ°ΠΆΠ°Π΅Ρ ΠΎΠΊΠ½ΠΎ Π΄Π»Ρ ΠΏΠΎΠΊΡΠΏΠΊΠΈ ΡΠΎΠ²Π°ΡΠ° Ρ Π½Π°ΠΈΠΌΠ΅Π½ΠΎΠ²Π°Π½ΠΈΠ΅ΠΌ "item_25new".
// ΠΠ°Π·Π²Π°Π½ΠΈΡ ΠΏΠ»Π°ΡΡΠΆΠ½ΡΡ
ΡΠΎΠ±ΡΡΠΈΠΉ ΠΏΠΈΡΡΡΡΡ Π² ΠΊΠΎΠ½ΡΠ΅ΠΉΠ½Π΅Ρ Ρ id="callbacks".
function order() {
const params = {
type: 'item',
item: 'item_25new',
};
VK.callMethod('showOrderBox', params);
}
let callbacksResults = document.getElementById('callbacks');
VK.addCallback('onOrderSuccess', function (order_id) {
callbacksResults.innerHTML += '<br />onOrderSuccess ' + order_id;
});
VK.addCallback('onOrderFail', function () {
callbacksResults.innerHTML += '<br />onOrderFail';
});
VK.addCallback('onOrderCancel', function () {
callbacksResults.innerHTML += '<br />onOrderCancel';
});
// ΠΠ±ΡΠ°ΡΠΈΡΠ΅ Π²Π½ΠΈΠΌΠ°Π½ΠΈΠ΅ β Π² ΡΠ΅ΡΡΠΎΠ²ΠΎΠΌ ΡΠ΅ΠΆΠΈΠΌΠ΅ ΠΏΠΎΠ΄ΠΏΠΈΡΠΊΠ° 5 ΡΠ°Π· Π°Π²ΡΠΎΠΌΠ°ΡΠΈΡΠ΅ΡΠΊΠΈ ΠΏΡΠΎΠ΄Π»Π΅Π²Π°Π΅ΡΡΡ ΡΠ°Π· Π² 10 ΠΌΠΈΠ½ΡΡ (Π΄Π»Ρ period = month) ΠΈ ΡΠ°Π· Π² 2 ΠΌΠΈΠ½ΡΡΡ Π΄Π»Ρ Π΄ΡΡΠ³ΠΈΡ
Π·Π½Π°ΡΠ΅Π½ΠΈΠΉ period. ΠΠΎΡΠ»Π΅ ΡΡΠΎΠ³ΠΎ ΠΏΠΎΠ΄ΠΏΠΈΡΠΊΠ° Π°Π²ΡΠΎΠΌΠ°ΡΠΈΡΠ΅ΡΠΊΠΈ ΠΎΡΠΌΠ΅Π½ΡΠ΅ΡΡΡ.
function order() {
VK.callMethod('showSubscriptionBox', 'create', { item: 'subscription1' });
}
let callbacksResults = document.getElementById('callbacks');
VK.addCallback('onSubscriptionSuccess', function (subscription_id) {
callbacksResults.innerHTML += '<br />onSubscriptionSuccess ' + subscription_id;
});
VK.addCallback('onSubscriptionFail', function () {
callbacksResults.innerHTML += '<br />onSubscriptionFail';
});
VK.addCallback('onSubscriptionCancel', function () {
callbacksResults.innerHTML += '<br />onSubscriptionCancel';
});
// Π€ΡΠ½ΠΊΡΠΈΡ order ΠΏΠΎΠ·Π²ΠΎΠ»ΡΠ΅Ρ ΠΎΡΠΎΠ±ΡΠ°Π·ΠΈΡΡ ΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΠ΅Π»Ρ ΠΎΠΊΠ½ΠΎ Π΄Π»Ρ ΠΏΠΎΠΊΡΠΏΠΊΠΈ ΡΠΎΠ²Π°ΡΠ° Ρ Π½Π°ΠΈΠΌΠ΅Π½ΠΎΠ²Π°Π½ΠΈΠ΅ΠΌ 'subscription_25new'. ΠΠ°Π·Π²Π°Π½ΠΈΡ ΠΏΡΠΎΠΈΠ·ΠΎΡΠ΅Π΄ΡΠΈΡ
ΠΏΠ»Π°ΡΡΠΆΠ½ΡΡ
ΡΠΎΠ±ΡΡΠΈΠΉ ΠΏΠΈΡΡΡΡΡ Π² ΠΊΠΎΠ½ΡΠ΅ΠΉΠ½Π΅Ρ Ρ id="callbacks".
============================================================== ============================================ CHECKBOX ======================
<label class="b-contain">
<span>First checkbox</span> <input type="checkbox" />
<div class="b-input"></div>
</label>
<label class="b-contain">
<span>Second checkbox</span> <input type="checkbox" checked />
<div class="b-input"></div>
</label>
<label class="b-contain">
<input type="checkbox" disabled /> <span>Third checkbox</span>
<div class="b-input"></div>
</label>
<label class="b-contain">
<span>Fourth checkbox</span> <input type="checkbox" checked disabled />
<div class="b-input"></div>
</label>
<label class="b-contain">
<span>First radio</span>
<input type="radio" name="radio1" />
<div class="b-input"></div>
</label>
<label class="b-contain">
<span>Second radio</span>
<input type="radio" name="radio1" checked />
<div class="b-input"></div>
</label>
<label class="b-contain">
<input type="radio" name="radio2" disabled />
<span>Third radio</span>
<div class="b-input"></div>
</label>
<label class="b-contain">
<span>Fourth radio</span>
<input type="radio" name="radio2" checked disabled />
<div class="b-input"></div>
</label>
.b-contain *,
.b-contain *::before,
.b-contain *::after {
box-sizing: content-box !important;
}
.b-contain input {
position: absolute;
z-index: -1;
opacity: 0;
}
.b-contain span {
line-height: 1.54;
font-size: 1rem;
font-family: inherit;
}
.b-contain {
display: table;
position: relative;
padding-left: 1.8rem;
cursor: pointer;
margin-bottom: 0.5rem;
}
.b-contain input[type='checkbox'] ~ .b-input {
position: absolute;
top: 0;
left: 0;
height: 1.25rem;
width: 1.25rem;
background: rgba(241, 245, 248, 1);
transition: background 250ms;
border: 1px solid rgba(184, 194, 204, 1);
border-radius: 0.125rem;
}
.b-contain input[type='radio'] ~ .b-input {
position: absolute;
top: 0;
left: 0;
height: 1.25rem;
width: 1.25rem;
background: rgba(241, 245, 248, 1);
transition: background 250ms;
border: 1px solid rgba(184, 194, 204, 1);
border-radius: 2rem;
}
.b-contain input[type='checkbox'] ~ .b-input::after {
content: '';
position: absolute;
display: none;
left: 0.45rem;
top: 0.18rem;
width: 0.25rem;
height: 0.6rem;
border: solid rgba(255, 255, 255, 1);
border-width: 0 2px 2px 0;
transition: background 250ms;
transform: rotate(45deg);
}
.b-contain input[type='radio'] ~ .b-input::after {
content: '';
position: absolute;
display: none;
left: 0.25rem;
top: 0.25rem;
width: 0.75rem;
height: 0.75rem;
border-radius: 2rem;
background: rgba(255, 255, 255, 1);
transition: background 250ms;
}
.b-contain input:disabled ~ .b-input::after {
border-color: rgba(135, 149, 161, 1);
}
.b-contain input:checked ~ .b-input::after {
display: block;
}
.b-contain:hover input ~ .b-input,
.b-contain input:focus ~ .b-input {
background: rgb(231, 238, 243);
}
.b-contain input:focus ~ .b-input {
box-shadow: 0 0 0 2px rgba(52, 144, 220, 0.5);
}
.b-contain input:checked ~ .b-input {
background: rgba(0, 130, 243, 1);
border-color: rgba(0, 130, 243, 1);
}
.b-contain input[type='checkbox']:disabled ~ .b-input {
background: rgba(241, 245, 248, 1);
border-color: rgba(184, 194, 204, 1);
opacity: 0.6;
cursor: not-allowed;
}
.b-contain input[type='radio']:disabled ~ .b-input {
background: rgba(241, 245, 248, 1);
border-color: rgba(184, 194, 204, 1);
opacity: 0.6;
cursor: not-allowed;
}
.b-contain input[type='radio']:disabled ~ .b-input::after {
background: rgba(135, 149, 161, 1);
}
.b-contain input:checked:focus ~ .b-input,
.b-contain:hover input:not([disabled]):checked ~ .b-input {
background: rgba(13, 143, 255, 1);
border-color: rgba(13, 143, 255, 1);
}
.b-contain .b-input::before {
content: '';
display: block;
position: absolute;
left: 0;
top: 0;
width: 3rem;
height: 3rem;
margin-left: -0.85rem;
margin-top: -0.85rem;
background: rgba(0, 130, 243, 1);
border-radius: 2rem;
opacity: 0.6;
z-index: 99999;
transform: scale(0);
}
@keyframes b-ripple {
0% {
transform: scale(0);
}
20% {
transform: scale(1);
}
100% {
opacity: 0;
transform: scale(1);
}
}
@keyframes b-ripple-duplicate {
0% {
transform: scale(0);
}
30% {
transform: scale(1);
}
60% {
transform: scale(1);
}
100% {
opacity: 0;
transform: scale(1);
}
}
.b-contain input + .b-input::before {
animation: b-ripple 250ms ease-out;
}
.b-contain input:checked + .b-input::before {
animation-name: b-ripple-duplicate;
}
.b-contain .b-input::before {
visibility: hidden;
}
.b-contain input:focus + .b-input::before {
visibility: visible;
}
.b-contain:first-child .b-input::before {
visibility: hidden;
}
'beforeend', `
</li>`,
${item}
===================================================================
checkbox = document.getElementById('conducted');
checkbox.addEventListener('change', e => {
if (e.target.checked) {
//do something
}
});
=============================================
document.getElementById('myCheckBoxID').checked = true; // Check
document.getElementById('myCheckBoxID').checked = false; // Uncheck
// Check
document.getElementById('checkbox').checked = true;
// Uncheck
document.getElementById('checkbox').checked = false;
// how to check if input is checked javascript
const cb = document.getElementById('accept');
console.log(cb.checked);
==============================================
<input type="checkbox" id="check" />
<a href="#" onclick="check()">click</a>
<button onclick="check()">button</button>
function check() {
if (document.getElementById('check').checked) {
alert('checked');
} else {
alert('Not checked.');
}
}
=============================================
//using plane javascript
if (document.getElementById('on_or_off_checkbox').checked) {
//I am checked
}
var options = document.getElementById('mySelectID').options;
for (let i = 0; i < options.length; i++) {
console.log(options[i].value);//log the value
.block {
// ΠΠΠΠ;
}
.block__element {
// ΠΠΠΠ__ΠΠΠΠΠΠΠΠ ΠΠΠΠΠΠΠ’Π;
}
.block--modificator {
// ΠΠΠΠ--ΠΠΠΠΠΠΠΠ ΠΠΠΠΠ€ΠΠΠΠ’ΠΠ Π;
}
ΠΠ»Ρ ΠΊΠΎΡΡΠ΅ΠΊΡΠ½ΠΎΠΉ ΡΠ°Π±ΠΎΡΡ SASS-ΠΊΠΎΠΌΠΏΠΈΠ»ΡΡΠΎΡΠ° ΠΈ Π΄ΡΡΠ³ΠΈΡ ΠΈΠ½ΡΡΡΡΠΌΠ΅Π½ΡΠΎΠ², Π½Π΅ΠΎΠ±Ρ ΠΎΠ΄ΠΈΠΌΠΎ ΠΎΠ΄ΠΈΠ½ ΡΠ°Π· Π³Π»ΠΎΠ±Π°Π»ΡΠ½ΠΎ ΠΏΠΎΡΡΠ°Π²ΠΈΡΡ Π΄ΠΎΠΏΠΎΠ»Π½ΠΈΡΠ΅Π»ΡΠ½ΡΠ΅ ΠΏΠ°ΠΊΠ΅ΡΡ, Π²ΡΠΏΠΎΠ»Π½ΠΈΠ² Π² ΡΠ΅ΡΠΌΠΈΠ½Π°Π»Π΅ ΡΠ»Π΅Π΄ΡΡΡΠΈΠ΅ ΠΊΠΎΠΌΠ°Π½Π΄Ρ. ΠΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΠ΅Π»ΡΠΌ MacOS Π½ΠΈΡΠ΅Π³ΠΎ Π΄Π΅Π»Π°ΡΡ Π½Π΅ Π½ΡΠΆΠ½ΠΎ.
ΠΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΠ΅Π»ΡΠΌ Windows, Π² ΡΠ΅ΠΆΠΈΠΌΠ΅ Π°Π΄ΠΌΠΈΠ½ΠΈΡΡΡΠ°ΡΠΎΡΠ°. ΠΠ°ΠΊ Π·Π°ΠΏΡΡΡΡΠΈΡΡ Powershell Π² ΡΠ΅ΠΆΠΈΠΌΠ΅ Π°Π΄ΠΌΠΈΠ½ΠΈΡΡΡΠ°ΡΠΎΡΠ°.
npm install --global --production windows-build-tools
ΠΠΎΡ ΠΊΠ°ΠΊ Π²ΡΠ³Π»ΡΠ΄ΠΈΡ ΠΏΡΠΎΡΠ΅ΡΡ ΡΡΠΏΠ΅ΡΠ½ΠΎΠΉ ΡΡΡΠ°Π½ΠΎΠ²ΠΊΠΈ Π΄Π»Ρ ΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΠ΅Π»Π΅ΠΉ Windows.
ΠΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΠ΅Π»ΡΠΌ Linux.
sudo apt-get install gcc g++ make
ΠΠ»Ρ Π±ΡΡΡΡΠΎΠ³ΠΎ ΡΡΠ°ΡΡΠ° Π½Π΅ΠΎΠ±Ρ ΠΎΠ΄ΠΈΠΌΠΎ ΡΠΊΠ»ΠΎΠ½ΠΈΡΠΎΠ²Π°ΡΡ ΡΠ΅ΠΏΠΎΠ·ΠΈΡΠΎΡΠΈΠΉ.
git clone https://github.com/luxplanjay/webpack-starter-kit.git
ΠΠ΅ΡΠ΅ΠΈΠΌΠ΅Π½ΠΎΠ²Π°ΡΡ ΠΏΠ°ΠΏΠΊΡ ΡΠ±ΠΎΡΠΊΠΈ ΠΈΠΌΠ΅Π½Π΅ΠΌ Π²Π°ΡΠ΅Π³ΠΎ ΠΏΡΠΎΠ΅ΠΊΡΠ°.
mv webpack-starter-kit ΠΈΠΌΡ_ΠΏΡΠΎΠ΅ΠΊΡΠ°
ΠΠ°ΡΠ΅ΠΌ ΠΏΠ΅ΡΠ΅ΠΉΡΠΈ Π² ΠΏΠ°ΠΏΠΊΡ ΠΏΡΠΎΠ΅ΠΊΡΠ°.
cd ΠΈΠΌΡ_ΠΏΡΠΎΠ΅ΠΊΡΠ°
ΠΠ°Ρ
ΠΎΠ΄ΡΡΡ Π² ΠΏΠ°ΠΏΠΊΠ΅ ΠΏΡΠΎΠ΅ΠΊΡΠ° ΡΠ΄Π°Π»ΠΈΡΡ ΠΏΠ°ΠΏΠΊΡ .git
ΡΠ²ΡΠ·Π°Π½Π½ΡΡ Ρ ΡΠ΅ΠΏΠΎΠ·ΠΈΡΠΎΡΠΈΠ΅ΠΌ ΡΠ±ΠΎΡΠΊΠΈ Π²ΡΠΏΠΎΠ»Π½ΠΈΠ²
ΡΠ»Π΅Π΄ΡΡΡΡΡ ΠΊΠΎΠΌΠ°Π½Π΄Ρ.
npx rimraf .git
Π£ΡΡΠ°Π½ΠΎΠ²ΠΈΡΡ Π²ΡΠ΅ Π·Π°Π²ΠΈΡΠΈΠΌΠΎΡΡΠΈ.
npm install
Π Π·Π°ΠΏΡΡΡΠΈΡΡ ΡΠ΅ΠΆΠΈΠΌ ΡΠ°Π·ΡΠ°Π±ΠΎΡΠΊΠΈ.
npm start
ΠΠΎ Π²ΠΊΠ»Π°Π΄ΠΊΠ΅ Π±ΡΠ°ΡΠ·Π΅ΡΠ° ΠΏΠ΅ΡΠ΅ΠΉΡΠΈ ΠΏΠΎ Π°Π΄ΡΠ΅ΡΡ http://localhost:4040.
ΠΠ»Ρ ΡΠΎΠ³ΠΎ ΡΡΠΎΠ±Ρ ΡΠΎΠ·Π΄Π°ΡΡ ΠΎΠΏΡΠΈΠΌΠΈΠ·ΠΈΡΠΎΠ²Π°Π½Π½ΡΠ΅ ΡΠ°ΠΉΠ»Ρ Π΄Π»Ρ Ρ
ΠΎΡΡΠΈΠ½Π³Π°, Π½Π΅ΠΎΠ±Ρ
ΠΎΠ΄ΠΈΠΌΠΎ Π²ΡΠΏΠΎΠ»Π½ΠΈΡΡ ΡΠ»Π΅Π΄ΡΡΡΡΡ
ΠΊΠΎΠΌΠ°Π½Π΄Ρ. Π ΠΊΠΎΡΠ½Π΅ ΠΏΡΠΎΠ΅ΠΊΡΠ° ΠΏΠΎΡΠ²ΠΈΡΡΡ ΠΏΠ°ΠΏΠΊΠ° build
ΡΠΎ Π²ΡΠ΅ΠΌΠΈ ΠΎΠΏΡΠΈΠΌΠΈΠ·ΠΈΡΠΎΠ²Π°Π½Π½ΡΠΌΠΈ ΡΠ΅ΡΡΡΡΠ°ΠΌΠΈ.
npm run build
Π‘Π±ΠΎΡΠΊΠ° ΠΌΠΎΠΆΠ΅Ρ Π°Π²ΡΠΎΠΌΠ°ΡΠΈΡΠ΅ΡΠΊΠΈ Π΄Π΅ΠΏΠ»ΠΎΠΈΡΡ Π±ΠΈΠ»Π΄ Π½Π° GitHub Pages ΡΠ΄Π°Π»Π΅Π½Π½ΠΎΠ³ΠΎ (remote) ΡΠ΅ΠΏΠΎΠ·ΠΈΡΠΎΡΠΈΡ.
ΠΠ»Ρ ΡΡΠΎΠ³ΠΎ Π½Π΅ΠΎΠ±Ρ
ΠΎΠ΄ΠΈΠΌΠΎ Π² ΡΠ°ΠΉΠ»Π΅ package.json
ΠΎΡΡΠ΅Π΄Π°ΠΊΡΠΈΡΠΎΠ²Π°ΡΡ ΠΏΠΎΠ»Π΅ homepage
, Π·Π°ΠΌΠ΅Π½ΠΈΠ² ΠΈΠΌΡ
ΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΠ΅Π»Ρ ΠΈ ΡΠ΅ΠΏΠΎΠ·ΠΈΡΠΎΡΠΈΡ Π½Π° ΡΠ²ΠΎΠΈ.
"homepage": "https://ΠΈΠΌΡ_ΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΠ΅Π»Ρ.github.io/ΠΈΠΌΡ_ΡΠ΅ΠΏΠΎΠ·ΠΈΡΠΎΡΠΈΡ"
ΠΠΎΡΠ»Π΅ ΡΠ΅Π³ΠΎ Π² ΡΠ΅ΡΠΌΠΈΠ½Π°Π»Π΅ Π²ΡΠΏΠΎΠ»Π½ΠΈΡΡ ΡΠ»Π΅Π΄ΡΡΡΡΡ ΠΊΠΎΠΌΠ°Π½Π΄Ρ.
npm run deploy
ΠΡΠ»ΠΈ Π½Π΅Ρ ΠΎΡΠΈΠ±ΠΎΠΊ Π² ΠΊΠΎΠ΄Π΅ ΠΈ ΡΠ²ΠΎΠΉΡΡΠ²ΠΎ homepage
ΡΠΊΠ°Π·Π°Π½ΠΎ Π²Π΅ΡΠ½ΠΎ, Π·Π°ΠΏΡΡΡΠΈΡΡΡ ΡΠ±ΠΎΡΠΊΠ° ΠΏΡΠΎΠ΅ΠΊΡΠ° Π²
ΠΏΡΠΎΠ΄Π°ΠΊΡΠ΅Π½, ΠΏΠΎΡΠ»Π΅ ΡΠ΅Π³ΠΎ ΡΠΎΠ΄Π΅ΡΠΆΠΈΠΌΠΎΠ΅ ΠΏΠ°ΠΏΠΊΠΈ build
Π±ΡΠ΄Π΅Ρ ΠΏΠΎΠΌΠ΅ΡΠ΅Π½ΠΎ Π² Π²Π΅ΡΠΊΡ gh-pages
Π½Π°
ΡΠ΄Π°Π»Π΅Π½Π½ΠΎΠΌ (remote) ΡΠ΅ΠΏΠΎΠ·ΠΈΡΠΎΡΠΈΠΈ. Π§Π΅ΡΠ΅Π· ΠΊΠ°ΠΊΠΎΠ΅-ΡΠΎ Π²ΡΠ΅ΠΌΡ ΠΆΠΈΠ²ΡΡ ΡΡΡΠ°Π½ΠΈΡΡ ΠΌΠΎΠΆΠ½ΠΎ Π±ΡΠ΄Π΅Ρ ΠΏΠΎΡΠΌΠΎΡΡΠ΅ΡΡ
ΠΏΠΎ Π°Π΄ΡΠ΅ΡΡ ΡΠΊΠ°Π·Π°Π½Π½ΠΎΠΌΡ Π² ΠΎΡΡΠ΅Π΄Π°ΠΊΡΠΈΡΠΎΠ²Π°Π½Π½ΠΎΠΌ ΡΠ²ΠΎΠΉΡΡΠ²Π΅ homepage
.
ΠΠ²Π΅Π΄Π΅Π½ΠΈΠ΅ Π² ΠΈΠ½ΡΡΠ°ΡΡΡΡΠΊΡΡΡΡ ΠΏΡΠΎΠ΅ΠΊΡΠΎΠ²
β΄ https://github.com/mattboldt/typed.js
β΄ https://atomiks.github.io/tippyjs/
β΄ https://flatpickr.js.org/
β΄ https://sciactive.com/pnotify/
β΄ ttps://pawelgrzybek.github.io/siema/
β΄ https://basiclightbox.electerious.com/
βͺ (Ctrl + ~) (Ctrl + `)
βͺ view > teminal
βͺ ΡΠ΅ΡΠ΅Π· ΠΏΠ°Π»ΠΈΡΡΡ (Ctrl + Shift + p)
βͺ (Ctrl + c)
βͺ ΠΏΡΡΡ (pwd)
βͺ Π»ΠΈΡΡ (ls)
βͺ Π½Π°Π²ΠΈΠ³Π°ΡΠΈΡ (cd):
β΄ (cd ~) - ΠΏΠ΅ΡΠ΅ΠΌΠ΅ΡΠ΅Π½ΠΈΠ΅ Π² Π΄ΠΎΠΌΠ°ΡΠ½ΠΈΠΉ ΠΊΠ°ΡΠ°Π»ΠΎΠ³;
β΄ (cd -) - Π² ΠΏΡΠ΅Π΄ΡΠ΄ΡΡΠΈΠΉ ΠΊΠ°ΡΠ°Π»ΠΎΠ³;
β΄ (cd ..) - Π½Π° ΠΎΠ΄ΠΈΠ½ ΡΡΠΎΠ²Π΅Π½Ρ Π²ΡΡΠ΅;
β΄ (cd Directory1/Directory2) - Π² ΠΊΠ°ΡΠ°Π»ΠΎΠ³ Directory2 ΠΏΠΎ ΡΠΊΠ°Π·Π°Π½Π½ΠΎΠΌΡ ΠΏΡΡΠΈ;
βͺ ΠΎΡΠΈΡΡΠΊΠ° (clear) ΠΈΠ»ΠΈ (Ctrl + l)
βͺ ΡΠΎΠ·Π΄Π°Π½ΠΈΠ΅ ΡΠ°ΠΉΠ»ΠΎΠ² (touch)
βͺ ΡΠΎΠ·Π΄Π°Π½ΠΈΠ΅ ΠΏΠ°ΠΏΠΎΠΊ (mkdir)
βͺ ΠΏΠ΅ΡΠ΅ΠΈΠΌΠ΅Π½ΠΎΠ²Π°Π½ΠΈΠ΅/ΠΏΠ΅ΡΠ΅ΠΌΠ΅ΡΠ΅Π½ΠΈΠ΅ (mv) (mv file src/file)
βͺ ΡΠ΄Π°Π»Π΅Π½ΠΈΠ΅ (rm):
β΄ (rm -rf src) - ΡΠ΄Π°Π»Π΅Π½ΠΈΠ΅ ΡΠΎ Π²ΡΠ΅ΠΌ ΠΊΠΎΠΌΠΏΠ»Π΅ΠΊΡΡΡΡΠΈΠΌ
βͺ ΠΈΠ½ΡΠΎΡΠΌΠ°ΡΠΈΡ ΠΎ ΠΊΠΎΠΌΠ°Π½Π΄Π΅ (man) (man mkdir)
β’ npmjs.com - ΡΠ°ΠΉΡ Ρ Π΄ΠΎΠΊΡΠΌΠ΅Π½ΡΠ°ΡΠΈΠ΅ΠΉ ΠΎ ΠΏΠ°ΠΊΠ΅ΡΠ°Ρ
βͺ ΡΡΡΠ°Π½ΠΎΠ²ΠΊΠ° (npm install namePackage)
βͺ ΡΠ΄Π°Π»Π΅Π½ΠΈΠ΅ (npm uninstall namePackage)
βͺ pre ΠΈ post