mirror of
https://github.com/codex-team/editor.js
synced 2024-06-02 05:52:38 +02:00
104 lines
16 KiB
HTML
104 lines
16 KiB
HTML
<!DOCTYPE html>
|
||
<html>
|
||
<head>
|
||
<meta charset="utf-8">
|
||
<title>CodeX Editor</title>
|
||
<link rel="stylesheet" href="editor.css" />
|
||
<link href='https://fonts.googleapis.com/css?family=Open+Sans:400,300,400italic,600,700,800&subset=latin,cyrillic' rel='stylesheet' type='text/css'>
|
||
<style>
|
||
body{
|
||
font-family: 'Open Sans';
|
||
font-size: 14px;
|
||
}
|
||
</style>
|
||
</head>
|
||
<body style="padding: 100px">
|
||
|
||
|
||
<h1>CodeX Editor</h1>
|
||
|
||
<button id="codex_editor_export_btn">Сохранить</button>
|
||
<br>
|
||
<br>
|
||
<form action="">
|
||
|
||
<textarea hidden name="" id="codex_editor" cols="30" rows="10" style="width: 100%;height: 300px;">
|
||
<h2>Введение</h2> 1111
|
||
2222222 <a href="//link.ru">Link</a>444444
|
||
|
||
<p>На днях я получил очередной проект по разработке личного кабинета.<br> Как обычно, я открыл консоль, чтобы посмотреть историю проекта, ветки и все ли правки закомичены (от слова commit - фиксировать). Однако ничего из этого я не узнал — проект не содержал .git репозитория.<br> Эта ситуация в очередной раз заставила задуматься о том, как много разработчиков до сих пор не понимают необходимость контролировать изменения в файлах с исходным кодом. А многие и вовсе не знают что это такое, и как этим пользоваться.</p>
|
||
|
||
<h2>Почему нужно использовать систему контроля версий</h2>
|
||
<p>Основные преимущества:</p>
|
||
<ul>
|
||
<li>одновременная работа нескольких человек над проектом</li>
|
||
<li>возможность быстро обнаружить и откатить, все не зафиксированные изменения</li>
|
||
<li>возможность быстро откатить ошибочные, уже зафиксированные, изменения</li>
|
||
<li>история всех изменений в проекте, с указанием даты и авторов</li>
|
||
<li>возможность изучить процесс развития проекта</li>
|
||
</ul>
|
||
|
||
<h2>Что такое git</h2>
|
||
<p>git — распределенная система контроля версий файлов.<br> «Распределенная» значит, что каждый репозиторий содержит всю историю изменений, и из него можно развернуть полноценную рабочую копию проекта.</p> <h2>Основные термины и понятия при работе с системой Git</h2> <p><strong>Репозиторий </strong>— дерево изменений проекта.<br> После создания нового репозитория дерево содержит только одну ветку — master. Ветка состоит из коммитов, расположенных в хронологическом порядке. Как правило, в ветке master находятся проверенные и протестированные изменения.</p> <p><strong>Ветка </strong>— указатель на коммит. <br> На один коммит может указывать несколько веток. Как правило это случается при создании новой ветки из текущей. Например для реализации в ней новой задачи. По мере добавления коммитов — ветки будут расходится в разные стороны.</p> <p><strong>Коммит</strong> (от слова commit - фиксировать) — логическая единица изменений.<br> Каждый из них имеет историю уникальный ID и цепочку предшествующих коммитов. Можно «откатить» (отменить) изменения любого из коммитов. Для любого коммита из истории можно создать указатель, то есть ветку. </p> <p><strong>Индекс</strong> — изменения, которые будут зафиксированы при следующем коммите.<br> При этом, во время коммита, могут быть изменения, не добавленные в индекс — они не будут закоммичены. Их надо будет отдельно добавить в индекс и зафиксировать. Таким образом, можно вносить разом, все необходимые по мере работы, правки и фиксировать их логическими группами.</p> <p>В первое время вам понадобятся только основные команды. Давайте рассмотрим их:</p> <ul> <li>init — создает новый репозиторий</li> <li>status — отображает список измененных, добавленных и удаленных файлов</li> <li>branch — отображает список веток и активную среди них </li> <li>add — добавляет указанные файлы в индекс</li> <li>reset — удаляет указанные файлы из индекса</li> <li>commit — фиксирует добавленнные в индекс изменения</li> <li>checkout — переключает активную ветку; отменяет не добавленные в индекс изменения</li> <li>merge — объединяет указанную ветку с активной </li> <li>log — выводит список последних коммитов (можно указать количество и формат)</li> </ul> <h2>Примеры команд для работы с Git</h2> <p>Создайте новую папку для тестового проекта.</p> <p>Чтобы начать работу с гитом, надо его инициализировать — открыть консоль, перейти в корневую папку проекта и выполнить команду:</p> <p><code>$ <span class="sc_keyword">git</span> init</code></p> <p>Эта команда создаст новый пустой репозиторий. Проще говоря, появится папка .git с какими-то непонятными файлами. Причем такой репозиторий, который находится в папке проекта, файлы которого вы можете менять — называется «рабочей копией». Существуют еще «внешние копии» или bare-репозитории.</p> <p>Все остальные команды можно вызывать в корневой папке или в одной из вложенных.</p> <p>Теперь можно вносить изменения.</p> <p>Список изменений можно увидеть выполнив команду:</p> <p><code>$ <span class="sc_keyword">git</span> status</code></p> <p>В консоли появится список измененных файлов.</p> <p>Добавьте файлы, изменения в которых вы хотите зафиксировать:</p> <p><code>$ <span class="sc_keyword">git</span> add file_name_a.php</code></p> <p>Файлы можно указывать через пробел. Все файлы в данной папке и ее подпаках можно добавить командой:</p> <p><code>$ <span class="sc_keyword">git</span> add .</code></p> <p>Будьте внимательны, эта команда не добавит новые файлы в индекс. Добавятся только модифицированные старые файлы и удаленные. Новые файлы можно добавить явно указав имя. </p> <p>Добавить все новые и измененные файлы можно командой:</p> <p><code>$ <span class="sc_keyword">git</span> add -A</code></p> <p>Изменения стоит фиксировать логическими блоками, то есть в одном коммите должны быть файлы связанные с решением одной конкретной ошибки или одной конкретной новой задачи.</p> <p>Если вы добавили файл из другого логического блока, удалите его из индекса командой:</p> <p><code>$ <span class="sc_keyword">git</span> reset file_name_b.php</code></p> <p>Зафиксируйте эти изменения в другом коммите. Так будет удобнее при просмотре истории изменений и отмене изменений.</p> <p>Если вы случайно изменили не тот файл - верните его к последнему зафиксированному состоянию командой:</p> <p><code>$ <span class="sc_keyword">git</span> checkout file_name_c.php</code></p> <p>Отменить изменения всех, ранее существующих, файлах в данной и вложенных папках можно командой:</p> <p><code>$ <span class="sc_keyword">git</span> checkout -- .</code></p> <p>Ненужные новые файлы достаточно просто удалить. Или это можно сделать командой:</p> <p><code>$ <span class="sc_keyword">git</span> reset --hard HEAD</code></p> <p>Проект будет полностью приведен к последнему зафиксированному состоянию.</p> <p>Теперь зафиксируйте изменения добавленные в индекс:</p> <p><code>$ <span class="sc_keyword">git</span> commit</code></p> <p>Откроется текстовый редактор по-умолчанию для того, чтобы добавить комментарий к коммиту. Распишите, что и зачем вы меняли. Но не перечисляйте список измененных файлов — гит сделает это за вас. Комментарий должен коротким и понятным, например:</p> <p><code>fix| order price</code></p> <p><code>now price includes vat</code></p> <p>Комментарии лучше писать на английском языке, в первую очередь потому, консоль может не поддерживать кириллицу и вместо описания будут кракозяблики.</p> <p>Первая строка самая важная и должна включать суть коммита в нескольких словах. Дальше можете не жалеть строк и расписать подробно что, зачем и почему было изменено (речь про логику, а не про файлы).</p> <p>Теперь можно посмотреть историю изменений, ваш коммит должен в ней отобразиться:</p> <p><code>$ <span class="sc_keyword">git</span> log</code></p> <h2>Заключение</h2> <p>Как видите, ничего сложного.</p> <p>Конечно это далеко не все, что может гит, но именно этого мне не хватало в свое время для того, чтобы начать пользоваться системой контроля версий.</p> </div>
|
||
</textarea>
|
||
|
||
</form>
|
||
|
||
<!--
|
||
<div class="ce_wrapper">
|
||
|
||
<div class="ce_toolbar">
|
||
|
||
<span class="toggler"><i class="ce_icon-plus-circled-1"></i></span>
|
||
|
||
<li data-type="header"><i class="ce_icon-header"></i></li>
|
||
<li data-type="picture"><i class="ce_icon-picture"></i></li>
|
||
<li data-type="list"><i class="ce_icon-list"></i></li>
|
||
<li data-type="quote"><i class="ce_icon-quote"></i></li>
|
||
<li data-type="code"><i class="ce_icon-code"></i></li>
|
||
<li data-type="twitter"><i class="ce_icon-twitter"></i></li>
|
||
<li data-type="instagram"><i class="ce_icon-instagram"></i></li>
|
||
<li data-type="smile"><i class="ce_icon-smile"></i></li>
|
||
|
||
</div>
|
||
|
||
<div class="ce_redactor" contenteditable="true">
|
||
<h2>Введение</h2>
|
||
<p>На днях я получил очередной проект по разработке личного кабинета.<br> Как обычно, я открыл консоль, чтобы посмотреть историю проекта, ветки и все ли правки закомичены (от слова commit - фиксировать). Однако ничего из этого я не узнал — проект не содержал .git репозитория.<br> Эта ситуация в очередной раз заставила задуматься о том, как много разработчиков до сих пор не понимают необходимость контролировать изменения в файлах с исходным кодом. А многие и вовсе не знают что это такое, и как этим пользоваться.</p>
|
||
|
||
<h2>Почему нужно использовать систему контроля версий</h2>
|
||
<p>Основные преимущества:</p>
|
||
<ul>
|
||
<li>одновременная работа нескольких человек над проектом</li>
|
||
<li>возможность быстро обнаружить и откатить, все не зафиксированные изменения</li>
|
||
<li>возможность быстро откатить ошибочные, уже зафиксированные, изменения</li>
|
||
<li>история всех изменений в проекте, с указанием даты и авторов</li>
|
||
<li>возможность изучить процесс развития проекта</li>
|
||
</ul>
|
||
</div>
|
||
</div>
|
||
-->
|
||
|
||
|
||
</body>
|
||
</html>
|
||
|
||
<!-- <script src="ce_interface.js"></script> -->
|
||
<script src="codex-editor.js"></script>
|
||
<script>
|
||
|
||
function ready(f){
|
||
/in/.test(document.readyState) ? setTimeout(ready,9,f) : f();
|
||
}
|
||
|
||
/** Document is ready */
|
||
ready(function() {
|
||
|
||
cEditor.start({
|
||
textareaId: 'codex_editor'
|
||
});
|
||
|
||
})
|
||
|
||
</script>
|