Mind Map Presentation Project

So today me, and my team finished our site for the course – “Teamwork and knowledge sharing”, so i decided to make a short post about it, and show you what we have done! 🙂

What is a Mind Map ?

Qute from Wikipedia:

A mind map is a diagram used to visually outline information. A mind map is often created around a single word or text, placed in the center, to which associated ideas, words and concepts are added. Major categories radiate from a central node, and lesser categories are sub-branches of larger branches.Categories can represent words, ideas, tasks, or other items related to a central key word or idea.

Mindmaps can be drawn by hand, either as “rough notes” during a lecture or meeting, for example, or as higher quality pictures when more time is available. An example of a rough mind map is illustrated.

Other terms for this diagramming style are: “spider diagrams,” “spidergrams,” “spidergraphs,” “webs”, “mind webs”, or “webbing”, and “idea sun bursting”.(A “spider diagram” used in mathematics and logic is different.)

What is Mind Map Presentation Project ?

The main idea here is to make a site for mind maps developed for the book “Introduction to programming with C#” and to systemize them. The mindmaps where created by other teams for the course “Teamwork and knowledge sharing” and we made the site to host them.

What languages and technologies to we use to make Mind Map Presentation Project ?

The main technologies used where – HTML5, CSS3, JavaScript, JQuery and a JQuery Plugin – Easy Tabs .

Where can i see the site and it’s code?

Here is the link to the site – Click

Currently Offline

And a link to its GitHub Repository.

 

Advertisements

Какво е Zen-Coding и трябва ли да го използваме ?


В няколкото години в които съм се занимавал с писането на HTML и многото досадни Copy + Paste случай, реших да потърся алтернатива на тази досада и така без да искам попаднах на Zen-Coding.

Но какво всъщност е Zen-coding и защо трябва да го ползвам ?

Та в същността си Zen-coding представлява разширение за почти всички по-популярни IDE, което улеснява и намалява значително времето за писане на код.

Добре, как ускорява писането на код ?

Със прости съкратени команди може да генерирате значително количество код. Ето пример:

Имате нужда от div, в които има неподреден списък с 5 елемента, в които има линк. Пишете си в IDE-то : div>ul>li*5>a , натискаме Ctrl+E ( това е шорткъта за “разпъване” на код ) и ни изкрава готовия HTML код:

<div>
<ul>
<li><a href=""></a></li>
<li><a href=""></a></li>
<li><a href=""></a></li>
<li><a href=""></a></li>
<li><a href=""></a></li>
</ul>
</div>

Искаме елементите на листа да имат клас “item”. Няма проблем: Пишете си в IDE-то : div>ul>li.item*5>a и вече имаме готов HTML код:

<div>
<ul>
<li><a href=""></a></li>
<li><a href=""></a></li>
<li><a href=""></a></li>
<li><a href=""></a></li>
<li><a href=""></a></li>
</ul>
</div>

За пълен списък на това какво може да правите с съкратения код, може да видите тук

Но откъде да си го сваля ?

Тук може да намерите най-новата версия на Zen-Coding – цък

Заключение

Силно ви препоръчвам да ползвате Zen-Coding, тъй кат без него ще прекарате доста часове в Copy + Paste на НТМL код;