Skip to content

D
developer-guide
Commit aec520c2 authored by Тест Карнаухов's avatar Тест Карнаухов
Browse files
Options

refactor(*): convert spaces to tabs

parent c39ed3c7
Hide whitespace changes
Inline Side-by-side
Showing with 116 additions and 109 deletions
1-standards/1.1.1-html.md
View file @ aec520c2
...@@ -5,23 +5,23 @@ ...@@ -5,23 +5,23 @@
## Оглавление ## Оглавление
- [HTML](#html) - [HTML](#html)
- [Синтаксис](#html-syntax) - [Синтаксис](#html-syntax)
- [HTML5 doctype](#html-doctype) - [HTML5 doctype](#html-doctype)
- [Атрибут языка](#html-lang) - [Атрибут языка](#html-lang)
- [Режим совместимости Internet Explorer](#html-ie-compatibility-mode) - [Режим совместимости Internet Explorer](#html-ie-compatibility-mode)
- [Кодировка символов](#html-encoding) - [Кодировка символов](#html-encoding)
- [Подключение CSS и JavaScript](#html-style-script) - [Подключение CSS и JavaScript](#html-style-script)
- [Относительные и абсолютные пути до ресурсов](#html-absolute-and-relative-paths) - [Относительные и абсолютные пути до ресурсов](#html-absolute-and-relative-paths)
- [Название файлов](#html-file-name) - [Название файлов](#html-file-name)
- [Идентификаторы](#html-identificators) - [Идентификаторы](#html-identificators)
- [Порядок атрибутов](#html-attribute-order) - [Порядок атрибутов](#html-attribute-order)
- [Логические атрибуты](#html-boolean-attributes) - [Логические атрибуты](#html-boolean-attributes)
- [Элементы и атрибуты элементов форм](#html-form) - [Элементы и атрибуты элементов форм](#html-form)
- [Ссылки с протоколами](#html-links-and-protocol) - [Ссылки с протоколами](#html-links-and-protocol)
- [Сокращение разметки](#html-reducing-markup) - [Сокращение разметки](#html-reducing-markup)
- [Изображения](#html-images) - [Изображения](#html-images)
- [Взаимодействие HTML и JavaScript](#html-javascript) - [Взаимодействие HTML и JavaScript](#html-javascript)
- [Комментарии](#html-comments) - [Комментарии](#html-comments)
## <a name="html">HTML</a> ## <a name="html">HTML</a>
...@@ -52,7 +52,7 @@ ...@@ -52,7 +52,7 @@
<!-- Хорошо --> <!-- Хорошо -->
<div class="block"> <div class="block">
<div class="block__element">ZK</div> <div class="block__element">ZK</div>
</div> </div>
``` ```
...@@ -61,23 +61,23 @@ ...@@ -61,23 +61,23 @@
```html ```html
<!-- Плохо --> <!-- Плохо -->
<div class="project"> <div class="project">
<div class="project__name">Lorem</div> <div class="project__name">Lorem</div>
<div class="project__desc">Lorem ipsum dolor sit amet, consectetur adipisicing elit.</div> <div class="project__desc">Lorem ipsum dolor sit amet, consectetur adipisicing elit.</div>
</div> </div>
<div class="project"> <div class="project">
<div class="project__name">Ipsum.</div> <div class="project__name">Ipsum.</div>
<div class="project__desc">Lorem ipsum dolor sit amet, consectetur adipisicing elit.</div> <div class="project__desc">Lorem ipsum dolor sit amet, consectetur adipisicing elit.</div>
</div> </div>
<!-- Хорошо--> <!-- Хорошо-->
<div class="project"> <div class="project">
<div class="project__name">Lorem</div> <div class="project__name">Lorem</div>
<div class="project__desc">Lorem ipsum dolor sit amet, consectetur adipisicing elit.</div> <div class="project__desc">Lorem ipsum dolor sit amet, consectetur adipisicing elit.</div>
</div> </div>
<div class="project"> <div class="project">
<div class="project__name">Ipsum.</div> <div class="project__name">Ipsum.</div>
<div class="project__desc">Lorem ipsum dolor sit amet, consectetur adipisicing elit.</div> <div class="project__desc">Lorem ipsum dolor sit amet, consectetur adipisicing elit.</div>
</div> </div>
``` ```
...@@ -86,12 +86,12 @@ ...@@ -86,12 +86,12 @@
```html ```html
<!-- Плохо --> <!-- Плохо -->
<span> <span>
<div>:(</div> <div>:(</div>
</span> </span>
<!-- Хорошо --> <!-- Хорошо -->
<span> <span>
<span>:)</span> <span>:)</span>
</span> </span>
``` ```
...@@ -100,12 +100,12 @@ ...@@ -100,12 +100,12 @@
```html ```html
<!-- Плохо --> <!-- Плохо -->
<div class="block">∙ <div class="block">∙
<div class="block__element">ZK</div>∙∙∙∙ <div class="block__element">ZK</div>∙∙∙∙
</div>―――――――― </div>――――――――
<!-- Хорошо --> <!-- Хорошо -->
<div class="block"> <div class="block">
<div class="block__element">ZK</div> <div class="block__element">ZK</div>
</div> </div>
``` ```
...@@ -124,16 +124,16 @@ ...@@ -124,16 +124,16 @@
```html ```html
<!-- Плохо --> <!-- Плохо -->
<div class=block> <div class=block>
<div class=block__element>ZK</div> <div class=block__element>ZK</div>
</div> </div>
<div class='block'> <div class='block'>
<div class='block__element'>ZK</div> <div class='block__element'>ZK</div>
</div> </div>
<!-- Хорошо --> <!-- Хорошо -->
<div class="block"> <div class="block">
<div class="block__element">ZK</div> <div class="block__element">ZK</div>
</div> </div>
``` ```
...@@ -152,22 +152,22 @@ ...@@ -152,22 +152,22 @@
```html ```html
<!-- Плохо --> <!-- Плохо -->
<body> <body>
<p>Полезные инструменты <p>Полезные инструменты
<ul> <ul>
<li>Grunt <li>Grunt
<li>Jade <li>Jade
<li>Stylus <li>Stylus
</ul> </ul>
<!-- Хорошо --> <!-- Хорошо -->
<body> <body>
<p>Полезные инструменты</p> <p>Полезные инструменты</p>
<ul> <ul>
<li>Grunt</li> <li>Grunt</li>
<li>Jade</li> <li>Jade</li>
<li>Stylus</li> <li>Stylus</li>
</ul> </ul>
</body> </body>
``` ```
...@@ -179,10 +179,10 @@ ...@@ -179,10 +179,10 @@
<!DOCTYPE html> <!DOCTYPE html>
<html> <html>
<head> <head>
<!-- ... --> <!-- ... -->
</head> </head>
<body> <body>
<!-- ... --> <!-- ... -->
</body> </body>
</html> </html>
``` ```
...@@ -354,20 +354,20 @@ contacts.html ...@@ -354,20 +354,20 @@ contacts.html
- Формы не должны вкладываться друг в друга. Если они разные, то должны быть раздельны друг от друга. - Формы не должны вкладываться друг в друга. Если они разные, то должны быть раздельны друг от друга.
- Форма должна иметь атрибуты: - Форма должна иметь атрибуты:
- `action` - для указания адреса отправки данных. - `action` - для указания адреса отправки данных.
- `method` - метод передачи данных, обычно в значении указывается `post`. - `method` - метод передачи данных, обычно в значении указывается `post`.
```html ```html
<!-- Плохо --> <!-- Плохо -->
<form> <form>
<!-- ... --> <!-- ... -->
<button type="submit">Подать заявку</button> <button type="submit">Подать заявку</button>
</form> </form>
<!-- Хорошо --> <!-- Хорошо -->
<form action="send.php" method="post"> <form action="send.php" method="post">
<!-- ... --> <!-- ... -->
<button type="submit">Подать заявку</button> <button type="submit">Подать заявку</button>
</form> </form>
``` ```
...@@ -376,22 +376,22 @@ contacts.html ...@@ -376,22 +376,22 @@ contacts.html
```html ```html
<!-- Плохо --> <!-- Плохо -->
<form action="send.php" method="post"> <form action="send.php" method="post">
<!-- ... --> <!-- ... -->
<a href="send.php">Подать заявку</a> <a href="send.php">Подать заявку</a>
</form> </form>
<!-- Хорошо --> <!-- Хорошо -->
<form action="send.php" method="post"> <form action="send.php" method="post">
<!-- ... --> <!-- ... -->
<button type="submit">Подать заявку</button> <button type="submit">Подать заявку</button>
</form> </form>
``` ```
- Если нестандартные элементы форм типа списков или слайдеров генерируются с помощью JavaScript, то выбранное значение должно сохраняться в специальном теге `<input type="hidden">`, если испольузется тег `select`, то сохраняться в дочернем теге `option`. - Если нестандартные элементы форм типа списков или слайдеров генерируются с помощью JavaScript, то выбранное значение должно сохраняться в специальном теге `<input type="hidden">`, если испольузется тег `select`, то сохраняться в дочернем теге `option`.
- Элементы формы должны иметь атрибуты: - Элементы формы должны иметь атрибуты:
- `name` и `value` - для ключа и значения. - `name` и `value` - для ключа и значения.
- `for` и `id` - для связи надписи и элемента, при клике на надпись элемент будет фокусироваться. - `for` и `id` - для связи надписи и элемента, при клике на надпись элемент будет фокусироваться.
```html ```html
<label for="skype">Skype</label> <label for="skype">Skype</label>
......
1-standards/1.1.2-pug.md
View file @ aec520c2
...@@ -123,16 +123,16 @@ input.input-text(type='text' name='price' value=24999) ...@@ -123,16 +123,16 @@ input.input-text(type='text' name='price' value=24999)
```pug ```pug
//- Плохо //- Плохо
input.input-text(type='text' name='project' value='zk' data-required='Это поле обязательно для заполнения!' data-hint='Допустимы только символы латинского алфавита `[a-z-A-Z]` и числа `[0-9]`.' required) input.input-text(type='text' name='project' value='zk' data-required='Это поле обязательно для заполнения!' data-hint='Допустимы только символы латинского алфавита `[a-z-A-Z]` и числа `[0-9]`.' required)
//- Хорошо //- Хорошо
input.input-text( input.input-text(
type='text' type='text'
name='project' name='project'
value='zk' value='zk'
data-required='Это поле обязательно для заполнения!' data-required='Это поле обязательно для заполнения!'
data-hint='Допустимы только символы латинского алфавита `[a-z-A-Z]` и числа `[0-9]`.' data-hint='Допустимы только символы латинского алфавита `[a-z-A-Z]` и числа `[0-9]`.'
required required
) )
``` ```
...@@ -143,28 +143,28 @@ input.input-text( ...@@ -143,28 +143,28 @@ input.input-text(
```pug ```pug
//- Плохо //- Плохо
.project .project
.project__name Lorem .project__name Lorem
.project__desc .project__desc
| Lorem ipsum dolor sit amet, consectetur adipisicing elit. | Lorem ipsum dolor sit amet, consectetur adipisicing elit.
| Unde doloremque neque facilis sed repudiandae tempore ipsum provident officia eaque quas. | Unde doloremque neque facilis sed repudiandae tempore ipsum provident officia eaque quas.
.project .project
.project__name Ipsum. .project__name Ipsum.
.project__desc .project__desc
| Lorem ipsum dolor sit amet, consectetur adipisicing elit. | Lorem ipsum dolor sit amet, consectetur adipisicing elit.
| Unde doloremque neque facilis sed repudiandae tempore ipsum provident officia eaque quas. | Unde doloremque neque facilis sed repudiandae tempore ipsum provident officia eaque quas.
//- Хорошо //- Хорошо
.project .project
.project__name Lorem .project__name Lorem
.project__desc .project__desc
| Lorem ipsum dolor sit amet, consectetur adipisicing elit. | Lorem ipsum dolor sit amet, consectetur adipisicing elit.
| Unde doloremque neque facilis sed repudiandae tempore ipsum provident officia eaque quas. | Unde doloremque neque facilis sed repudiandae tempore ipsum provident officia eaque quas.
.project .project
.project__name Ipsum. .project__name Ipsum.
.project__desc .project__desc
| Lorem ipsum dolor sit amet, consectetur adipisicing elit. | Lorem ipsum dolor sit amet, consectetur adipisicing elit.
| Unde doloremque neque facilis sed repudiandae tempore ipsum provident officia eaque quas. | Unde doloremque neque facilis sed repudiandae tempore ipsum provident officia eaque quas.
``` ```
- Строчные элементы можно записывать на одной строке через двоеточие `:`.<br>Не злоупотреблять с длинными классами. - Строчные элементы можно записывать на одной строке через двоеточие `:`.<br>Не злоупотреблять с длинными классами.
...@@ -172,18 +172,18 @@ input.input-text( ...@@ -172,18 +172,18 @@ input.input-text(
```pug ```pug
//- Хорошо //- Хорошо
ul.nav ul.nav
li.nav__item li.nav__item
a.nav__link(href='/') Главная a.nav__link(href='/') Главная
li.nav__item li.nav__item
a.nav__link(href='/projects') Проекты a.nav__link(href='/projects') Проекты
li.nav__item li.nav__item
a.nav__link(href='/contacts') Контакты a.nav__link(href='/contacts') Контакты
//- Лучше //- Лучше
ul.nav ul.nav
li.nav__item: a.nav__link(href='/') Главная li.nav__item: a.nav__link(href='/') Главная
li.nav__item: a.nav__link(href='/projects') Проекты li.nav__item: a.nav__link(href='/projects') Проекты
li.nav__item: a.nav__link(href='/contacts') Контакты li.nav__item: a.nav__link(href='/contacts') Контакты
``` ```
## 6. Комментарии ## 6. Комментарии
...@@ -215,15 +215,15 @@ meta(name='msthemecompatible' content='no') ...@@ -215,15 +215,15 @@ meta(name='msthemecompatible' content='no')
```pug ```pug
mixin tools(list) mixin tools(list)
ul.list ul.list
each item in list each item in list
li.list__item li.list__item
span.mark= item[0] span.mark= item[0]
= ' - ' + item[1] = ' - ' + item[1]
+tools([ +tools([
['spritesmith', 'генератор спрайтов и CSS переменных'], ['spritesmith', 'генератор спрайтов и CSS переменных'],
['imagemin', 'сжатие картинок'] ['imagemin', 'сжатие картинок']
]) ])
``` ```
...@@ -231,12 +231,12 @@ mixin tools(list) ...@@ -231,12 +231,12 @@ mixin tools(list)
```html ```html
<ul class="list"> <ul class="list">
<li class="list__item"> <li class="list__item">
<span class="mark">spritesmith</span> - генератор спрайтов и CSS переменных <span class="mark">spritesmith</span> - генератор спрайтов и CSS переменных
</li> </li>
<li class="list__item"> <li class="list__item">
<span class="mark">imagemin</span> - сжатие картинок <span class="mark">imagemin</span> - сжатие картинок
</li> </li>
</ul> </ul>
``` ```
......
3-software/3.1-local-server.md
View file @ aec520c2
...@@ -15,9 +15,11 @@ Composer - менеджер зависимостей для PHP. По-умолч ...@@ -15,9 +15,11 @@ Composer - менеджер зависимостей для PHP. По-умолч
1. Скачайте последнюю версию файла [`composer.phar`](https://getcomposer.org/download/) 1. Скачайте последнюю версию файла [`composer.phar`](https://getcomposer.org/download/)
1. Замените им устаревшую версию в папке `php` 1. Замените им устаревшую версию в папке `php`
1. Создайте bat-файл для исполнения команды composer (для Windows): 1. Создайте bat-файл для исполнения команды composer (для Windows):
```
echo @php "%~dp0composer.phar" %*>composer.bat ```
``` echo @php "%~dp0composer.phar" %*>composer.bat
```
1. Добавить папку php в PATH 1. Добавить папку php в PATH
### Работа с проектами ### Работа с проектами
......
3-software/readme.md
View file @ aec520c2
...@@ -15,6 +15,7 @@ Node.js используется практически в каждом прое ...@@ -15,6 +15,7 @@ Node.js используется практически в каждом прое
1. Скачайте и установите [Node.js](https://nodejs.org) 1. Скачайте и установите [Node.js](https://nodejs.org)
1. Установите глобальные пакеты 1. Установите глобальные пакеты
```bash ```bash
npm install -g bower eslint eslint-config-google express-generator grunt-cli gulp mongodb node-inspector spawn-sync supervisor yo npm install -g bower eslint eslint-config-google express-generator grunt-cli gulp mongodb node-inspector spawn-sync supervisor yo
``` ```
...@@ -26,7 +27,9 @@ Node.js используется практически в каждом прое ...@@ -26,7 +27,9 @@ Node.js используется практически в каждом прое
1. Устанавливаем [MongoDB Community Server](https://www.mongodb.com/download-center) 1. Устанавливаем [MongoDB Community Server](https://www.mongodb.com/download-center)
1. Добавить папку с установленными бинарниками в PATH 1. Добавить папку с установленными бинарниками в PATH
1. Настраиваем исполнение MongoDB в качестве демона в Unix и в качестве службы в Windows 1. Настраиваем исполнение MongoDB в качестве демона в Unix и в качестве службы в Windows
Для Windows
Для Windows
``` ```
// Устанавливаем службу // Устанавливаем службу
mongod --dbpath=D:\mongodb --logpath=D:\mongodb\log.txt --install mongod --dbpath=D:\mongodb --logpath=D:\mongodb\log.txt --install
...@@ -46,11 +49,13 @@ _Рекомендую установить **portable** версию для по ...@@ -46,11 +49,13 @@ _Рекомендую установить **portable** версию для по
`View > Show Console menu`. После открытия вставьте соответствующий Python код для Вашей версии Sublime Text в консоль. `View > Show Console menu`. После открытия вставьте соответствующий Python код для Вашей версии Sublime Text в консоль.
Для Sublime Text 3: Для Sublime Text 3:
```python ```python
import urllib.request,os,hashlib; h = '2deb499853c4371624f5a07e27c334aa' + 'bf8c4e67d14fb0525ba4f89698a6d7e1'; pf = 'Package Control.sublime-package'; ipp = sublime.installed_packages_path(); urllib.request.install_opener( urllib.request.build_opener( urllib.request.ProxyHandler()) ); by = urllib.request.urlopen( 'http://packagecontrol.io/' + pf.replace(' ', '%20')).read(); dh = hashlib.sha256(by).hexdigest(); print('Error validating download (got %s instead of %s), please try manual install' % (dh, h)) if dh != h else open(os.path.join( ipp, pf), 'wb' ).write(by) import urllib.request,os,hashlib; h = '2deb499853c4371624f5a07e27c334aa' + 'bf8c4e67d14fb0525ba4f89698a6d7e1'; pf = 'Package Control.sublime-package'; ipp = sublime.installed_packages_path(); urllib.request.install_opener( urllib.request.build_opener( urllib.request.ProxyHandler()) ); by = urllib.request.urlopen( 'http://packagecontrol.io/' + pf.replace(' ', '%20')).read(); dh = hashlib.sha256(by).hexdigest(); print('Error validating download (got %s instead of %s), please try manual install' % (dh, h)) if dh != h else open(os.path.join( ipp, pf), 'wb' ).write(by)
``` ```
Для Sublime Text 2: Для Sublime Text 2:
```python ```python
import urllib2,os,hashlib; h = '2deb499853c4371624f5a07e27c334aa' + 'bf8c4e67d14fb0525ba4f89698a6d7e1'; pf = 'Package Control.sublime-package'; ipp = sublime.installed_packages_path(); os.makedirs( ipp ) if not os.path.exists(ipp) else None; urllib2.install_opener( urllib2.build_opener( urllib2.ProxyHandler()) ); by = urllib2.urlopen( 'http://packagecontrol.io/' + pf.replace(' ', '%20')).read(); dh = hashlib.sha256(by).hexdigest(); open( os.path.join( ipp, pf), 'wb' ).write(by) if dh == h else None; print('Error validating download (got %s instead of %s), please try manual install' % (dh, h) if dh != h else 'Please restart Sublime Text to finish installation') import urllib2,os,hashlib; h = '2deb499853c4371624f5a07e27c334aa' + 'bf8c4e67d14fb0525ba4f89698a6d7e1'; pf = 'Package Control.sublime-package'; ipp = sublime.installed_packages_path(); os.makedirs( ipp ) if not os.path.exists(ipp) else None; urllib2.install_opener( urllib2.build_opener( urllib2.ProxyHandler()) ); by = urllib2.urlopen( 'http://packagecontrol.io/' + pf.replace(' ', '%20')).read(); dh = hashlib.sha256(by).hexdigest(); open( os.path.join( ipp, pf), 'wb' ).write(by) if dh == h else None; print('Error validating download (got %s instead of %s), please try manual install' % (dh, h) if dh != h else 'Please restart Sublime Text to finish installation')
``` ```
...@@ -64,6 +69,7 @@ import urllib2,os,hashlib; h = '2deb499853c4371624f5a07e27c334aa' + 'bf8c4e67d14 ...@@ -64,6 +69,7 @@ import urllib2,os,hashlib; h = '2deb499853c4371624f5a07e27c334aa' + 'bf8c4e67d14
* `CoffeeScript` - подсветка кода для CoffeeScript. * `CoffeeScript` - подсветка кода для CoffeeScript.
* Настройте редактор для удобства с помощью `Preferences > Settings - User`. После открытия файла пользовательских настроек вставьте код ниже и сохраните. * Настройте редактор для удобства с помощью `Preferences > Settings - User`. После открытия файла пользовательских настроек вставьте код ниже и сохраните.
```js ```js
{ {
// Всегда отображается карта кода с рамкой текущего положения // Всегда отображается карта кода с рамкой текущего положения
...@@ -116,7 +122,6 @@ import urllib2,os,hashlib; h = '2deb499853c4371624f5a07e27c334aa' + 'bf8c4e67d14 ...@@ -116,7 +122,6 @@ import urllib2,os,hashlib; h = '2deb499853c4371624f5a07e27c334aa' + 'bf8c4e67d14
// Добавляет новую строку в конце файла // Добавляет новую строку в конце файла
"ensure_newline_at_eof_on_save": true "ensure_newline_at_eof_on_save": true
} }
``` ```
* Добавляем проект в Sublime Text с помощью `Project > Add Folder to Project`. Выбрав папку с проектом, он появится на панели проектов слева, которую можно открыть с помощью последовательных комбинаций горячих клавиш `ctrl+k` и `ctrl+b` или `View > Side Bar > Show Side Bar`.<br> * Добавляем проект в Sublime Text с помощью `Project > Add Folder to Project`. Выбрав папку с проектом, он появится на панели проектов слева, которую можно открыть с помощью последовательных комбинаций горячих клавиш `ctrl+k` и `ctrl+b` или `View > Side Bar > Show Side Bar`.<br>
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment