[Project] MindMap / Мисловни карти - що е то?

Като част от обучението ми в Академията на Телерик беше участието ми в екипен проект по курса "Споделяне на знания и работа в екип". Неговата основна цел беше допълване на статиите в бълграската Уикипедия по теми, свързани с програмиране, разработка на софтуер, софтуерно инженерство и информационни технологии.

Тук накратко може да се види описанието на проекта, темите и разпределението на отборите за проекта.

Темата, по която работих аз беше Мисловна карта - същност и характеристики на мисловните карти, правила и препоръки за създаването им, приложения, инструменти за създаване и галерия от примери на мисловни карти.

А ако желаете за разберете в подробности що е то мисловна карта и какво представлява - ето линк към завършената статия.

Работата включваше запознаване и прилагане на правилита и препоръките на Уикипедия за оформление и създаване на авторски текст, изследване и проучване на различни източници за намиране на нужната информация по темата, както и издирване на авторите на мисловните карти за галерията и осъществяването на контакт с тях за разрешение за използването им.

Накратко работата по проекта беше интересна и научих доста неща, ровейки се по темата. Попаднах и на мисловни карти, които могат да бъдат определени като истински шедьоври. Мисловните карти определено могат да бъдат доста полезни, особено за хора, които възприемат информацията предимно визуално.

А ето и директното приложение на наученето по темата - мисловната ми карта на тема текстови файлове :)

[Events] Game Programming Courses

Обичате да играете на игри и може би се питате как точно се създават те?

Искате да създадете своя собствена игра, но не знаете от къде да започнете?

В този случай курсовете, които ще ви предложа са точно за вас. Дори и да сте начинаещи след курсовете ще знаете как да създавате прости игри с Python или с C# и Microsoft XNA и със сигурност ще сте се забавлявали докато учите :)

Повече информация за формата на курсовете и програмата им можете да получите от линковете по-долу.

Аз също се надявам да ми остане достатъчно време да мога да се запиша поне на един от двата, защото определено звучат обещаващо.

An Introduction to Interactive Programming in Python

Програма на курса

Игрите, които ще бъдат създадени по време на курса са :

Rock-Paper-Scissors-Lizard-Spock"
"Guess the Number"
"Stopwatch"
"Pong"
images "Memory"
"Blackjack"
"RiceRocks"

Beginning Game Programming with C#

[Events]

Тази категория ще е посветена на новини за различни събития или курсове,на които съм попаднала в интернет пространството и съм преценила за интересни.

[Debugging] Полезни техники

Като всеки начинаещ в началото мисълта да използвам дебъгера леко ме плашеше, докато не установих колко полезен може да бъде той - най-напред, за да си визуализирам как точно се случват нещата в програмите, а след това и за да откривам неправилно работещите части в нея. Накратко можем да наречем дебъгера най-добрия приятел на програмиста :) негов верен помощник. Затова си струва да се отдели малко време, за да се разучат полезните техники, които могат да ни улеснят живота.

Полезни клавишни комбинации

F5 - влизаме в режим на дебъгване

F5 + SHIFT - изход от режим на дебъгване

F9 - поставяне на точка на прекъсване (breakpoint) за проследяване на изпълнението й

F10 Step Over - изпълнява програмата в дебъг режим ред по ред, без да влиза в кода на методите.

F11 Step Into - изпълнява методите в програмата, след приключване на метода се връща до реда на извикването на метода.

F11 + SHIFT - връща ни до реда на извъкването на метода, преди да е плиключило изпълнението на метода.

F12 - отвежда ни до дефиницията на метод или клас. Чрез F10/F11 се връщаме обратно до текущния ред.

Полезни техники за дебъгване

Проследяване на стойност

Можем да проверим стойността на променлива в движение,поставяйки курсора на мишката над нея, ако изпълнението на програмата вече е преминало през променливата и тя има присвоена стойност. Важно е да се отбележи, че присвоената стойност се отчита след преминаване на следващия ред.

Прекъсване при изпълнено условие / Conditional Breakpoint

Задаване на конкретно условие, при което програмата да спре изпълнението си.Опциите се появяват при задържан десен клавиш над точката на прекъсване. Това може да бъде полезно в цикли, когато кодът ни трябва да се изпълнвява например 100 пъти, а нас ни интересува единствено случая когато променливата е със стойност 50.Други полезни опции за избор на условие са : Location, HitCount, Filter, WhenHit, EditLabel. Последното позволява именуване на точките на прекъсване, което прави навигацията между тях много по-лесна.

Друг начин за изпъление на точно определен ред е задавайки опцията Set Next Statement с десен бутон върху променливата. След това вече можем да го изпълним чрез Go to Next Statement.

Immediate Window

Този прозорец ни позволява в движение да тестваме директно в него резултата от операции или присвояване.

Debug>Window>Immediate Window

Добавяне в списък за наблюдение / Add Watch, QuickWatch

Чрез Add Watch добавяме избраната променлива или израз в списъка от локални променливи в прозореца Watch, чрез което можем да следим как се променят стойностите й при изпълнението на програмата. тези стойности могат да бъдат и временно променени, за да се проследни изпълнението при определената стойност - например при i=3

Проследяване на извиканите методи / Call Stack

В дебъг режим ot меню Debug>Windows>Call Stacks можем да проследяваме всеки метод колко пъти е бил извикван.

Насоки

Следните насоки могат да подпомогнат по-лесното откриване на проблемите в кода

Възпроизвеждане на проблема, стъпката по стъпка, за да се установи на какво точно се дължи той. През колкото повече стъпки преминава дадена задача, толкова повече различни причини за грешка може да има.

Известно количество параноя при дебъгването не е излишно. Не трябва да се приема факата, че всичко работя така, както се очаква

Да се оправя само по един един проблем наведнъж.

Да се разучат възможностите на конкретния дебъгер.

Да се тества отново - когато си сигурен, че проблемът вече е отстранен ,тествай го отново при различни случай, за да се увериш, че наистина работи коректно.

още насоки за дебъгване

Алгоритми за сортиране

Сортирането е едно от основните действия, извършвани с данните при обработката им.Подтикната от домашното за масиви, в което присъстваха доста задачи за сортиране на масиви чрез различни алгоритми, реших да потърся информация за всеки от тях. Тук предлагам кратко обобщение на някой от най-известните алгоритми за сортиране на масиви и имплементацията им. Постепенно ще допълвам статията с други, не чак толкова популярни алгоритми.

Selection Sort

Този алгоритъм за сортиране е известен на български още като сортиране чрез пряка селекция.

Принципът му на действие се състои в :

1.Намиране на най-малкият елемент от масива

2.Размяна на стойностите на този елемент с първия елемент от масива

3.Тези действия се повтарят докато се изчерпят всички елементи и масивът бъде подреден в нарастващ ред

source

Merge Sort

Merge Sort e "разделяй и владей алгоритъм, базиран на сравнение."

1.Първоначално неподредения масив се разделя на две части.

2.След това всяка от получените части се разделя още на два подмасива, докато останат само единични елементи.

3.Всеки два съседни елемента се сравняват и елементите в двойката се обединяват и пореждат във възходящ ред.(Merge)

4.След изчерпване на единичните елементи се преминава към сравняване с елементите от съседната двойка.Съседните подмасиви се сравняват, подреждат и обединяват докато не бъдат подредени всички подмасиви и остане само един масив - подреденият.

source

Quick Sort

Принципът на действие на бързото сортиране не състои в следното :

1.Избира се елемент спрямо който ще се сравняват останалите елементи в масива т. нар. "pivot". За такъв елемент може да бъде избран - първия или последния елемент, медианата или произволен елемент от масива.

2.Всеки елемент се сранява с "pivot" елемента и се пренаредждат, така че елементите,по-малки от него се поставят вляво от него, а по-големите - вдясно от него.

3.Тези действия се повтарят рекурсивно - избира се нов "pivot" елемент за всяка подредица и отново се сравняват останалите елементи с него.

4.Получените подредици се сливат и получаваме подредения масив.

source

Bubble Sort

Методът на мехурчето е един от най-известните алгоритмни за сортиране :

1.Той сравнява последователно всичка двойка съседни елементи една с друга.

2.Ако се окаже, че вторият елемент е по-голям местата им се разменят.

Въпреки, че методът на мехурчето е един от най-семплите методи за сортиране ефективността му бързо намалява при употреба в големи редици от данни. Не е ефективен и при редици, подредени в обратен ред.

Insertion Sort

Този метод е подобен на методът на мехурчето, но е по-ефективен и намалява броя на свавняванията.

1.Даден елемент се сравнява съсъс всички по-големи елементи, докато не се открие елемент, по-малък от него.По този начин при всяка проверка първия елемент от неподредения подмасив се прехвърля в подредения подмасив, и с вмъква на определеното му място.

За редици от n елемента ще са нужни n-1 pроверки, за да се сортира целия масив. Подходящ е за сортиране на редици до 30 елемента.

Алгоритмите в действие

И накрая ето еднa доста забавна поредица от видеа,която визиализира алгоритмите на сортиране чрез танци :)

Selection Sort

Merge Sort

Quick Sort

Bubble Sort

Insertion Sort

to be continued ...

[C#] Conditional Statements

Споделям решенията си на по-интересниte задачи от темата за условни конструкции

Convert Number To String

Write a program that converts a number in the range [0...999] to a text corresponding to its English pronunciation.

Exemples :

0 - > "zero"

273 - > "two hundred seventy-three"

400 - > "four hundred"

501 - > "five hundred and one"

711 - > "seven hundred and eleven"

source

Sum of subset

We are given 5 integer numbers. Write a program that checks if the sum of some subset of them is 0.

Example: 3, -2, 1, 1, 8 -> 1+1-2=0.

[C#] Console Input / Output

Споделям решенията си на по-интересниte задачи от темата за вход и изход от конзолата

Редица на Фибоначи / Fibonacci Sequence

Write a program to print the first 100 members of the sequence of Fibonacci: 0, 1, 1, 2, 3, 5, 8, 13, 21, 34, 55, 89, 144, 233, 377, …

source

Сума от числа с плаваща запетая с точност 0.001 / Sum of floating point numbers with accuracy 0.001

Write a program to calculate the sum (with accuracy of 0.001): 1 + 1/2 - 1/3 + 1/4 - 1/5 + ...

source

Game Falling Rocks

Implement the "Falling Rocks" game in the text console. A small dwarf stays at the bottom of the screen and can move left and right (by the arrows keys). A number of rocks of different sizes and forms constantly fall down and you need to avoid a crash.

Rocks are the symbols ^, @, *, &, +, %, $, #, !, ., ;, - distributed with appropriate density. The dwarf is (O).

Implement collision detection and scoring system.

Най-интересната програмка до момента.Целта на играта е джуджето да се спаси от падащите скали.

За символите на различите скали и техните цветове използвам 2 масива,от които на случаен принцип генерирам елемент с определен символ и цвят.След това отново чрез рандом генератор генерирам символите, които се появяват в игралното поле. Създавам обекти и свойства за джуджето и скалите, като движението на джуджето се управлява с клавишите за лява и дясна стрелка, а движението на скалите чрез създаване на нови обекти за новите координати,копиране на свойствата им в тях и изчистване на старите. Играта е предвидена с 5 живота. Съответно при сблъсък играчът губи един живот и се увеличава скоростта на падащите скали.От друга страна символът 'О' дава бонус и носи +1 допълнителен живот.Играта завършва при 0 останали живота (Game Over) или натрупани 50 бонуса (WIN).

source

[C#] Primitive Data Types

Споделям решенията си на по-интересните задачи от темата за примитивните типове данни.Задачите, които съм подбрала са :

Сравняване на числа с плаваща запетая с точност до 0.000001

Write a program that safely compares floating-point numbers with precision of 0.000001. Examples: (5.3 ; 6.01)  false; (5.00000001 ; 5.00000003)  true

source

Принтиране на равнобедрен триъгълник (съставен от символ за копирайт)

Write a program that prints an isosceles triangle of 9 copyright symbols ©.Note: the © symbol may be displayed incorrectly.

source

Размяна на стойности на две променливи

Declare two integer variables and assign them with 5 and 10 and after that exchange their values.

source

Проекти и домашни

В тази категория ще слагам основно по-интересните задачи от домашните и проектите, правени по време на обучението ми в Академията на Телерик, заедно с разяснения по тях, където съм преценила,че има нужда. Проектите по програмиране ще са основно на C#,а по уеб дизайн - съответно с HTML,CSS и Javascript.

Моят GitHub профил

Ресурси за обучение онлайн

Местата в интернет за безплатно самообучение

За хората, които обичат да учат нови неща и ученето не е нещо, което се изчерпва с училището и университета има добри новини - все повече стават сайтовете, специализирани в безплатно обучение чрез видео.Какво по-лесно и приятно от това :)В България все още може да се каже, че Телерик Аcademy са единствените, който предлагат подобно безплатно и качествено ит обучение в такъв мащаб.

Ще се опитам да систематизирам на едно място няколко международни сайта за онлайн видеообучение, които определено смятам да следя редовно.

Coursera

Поставям го на първо място, защото е най-богатия сайт както откъм съдържание, така и откъм тематика. Предлага безплатни обучения от водещи международни университети, а категориите, от които можете да избирате са наистина разнообразни:

Изкуство, Биология, Химия, Компютърни науки, Икономика и Финанси, Науки за земята, Хранене, Обазование, Общество и здраве, Хуманитарни науки, Право, Математика, Медицина, Музика, филми и аудио, Информация, технологии у дизайн, Физика, Социални науки, Статистика и анализ на данни

Codecademy - Learn to code

Обучение чрез видео и упражнения под формата на игра.Предлага обучение по HTML,CSS, Javascipt, PHP,Python и Ruby

Code school

Обучение чрез видео и упражнения под формата на игра, в която събираш точки за всяко направено упражнение и получаваш правото да отключиш следващото ниво.Предлага обучение по HTML,CSS,SASS, Javascipt,jQuery, Ruby и iOS. Има безплатни обучения, както и платен месечен абонамент от 25$

Canvas network

Представлява отворена, онлайн мрежа за обучения в сътрудничество с различни университети. Темите също са разнообразни - Изкуство, История, Математика, Технологии и Хуманитарни науки

Udemy

Основно платени обучения,като най-евтините са по 19$.Има обучения по Ексел, уеб разработка и дизайн, iPhone приложения, PHP, Фотошоп и фотография И други.

Udacity - Learn. Think. Do.

Предлага курсове за начинаещи и напреднали в категориите Бизнес, Компютърни науки, Математика и Физика

Edx The Future of Online Education

Предлага безплатни курсове от водещите университети, с основни партньори Харвард и МИТ, създаден спесиално за интерактивно обучение през интернет

Class Central

Този сайт систематизира и предосатавя накуп обученията, предлагани от водещите международни университети като Станфорд, МИТ и Харвард по други подобни онлайн платформи за обучение - тук са включени курсовете от Coursera, Udacity, Canvas Network и други

Определено има какво да учат любознателните :) Така е, изберете вашия курс и започвайте !!!

Малко вдъхновение

Just for inspiration

В тази категория ще публикувам линкове към сайтове, които са ме вдъхновили или са ме впечатлили с нещо.

Ето едно добро начало за вдъхновение :

to be continued...

Полезни инструменти за уеб дизайн

Отдавна замислям да напиша една статия, която систематизира някои полезни инструменти за уеб дизайн. Ползата им за по-бързата и по-качествена работа е безспорна и определено вече си имам някои любими тулчета, с които стилизирането става хем по-лесно, хем по-бързо, хем по-приятно. Защото понякога става малко досадно за един начинаещ, без много опит в стилиизирането с CSS, да задава за н-ти пореден път някоя стойност в пиксели и да се окаже,че отново не е точната ... още повече когато някой друг вече е създал чудесен иструмент за измерването й :)

Накратко, това ще бъде статия с продължение, в която ще систематизирам полезни инструменти за уеб дизайн - плъгини, малки програмки или просто сайтове, които улесняват работата ни. Ще започна с инструментите, които влязоха за постоянно в арсенала ми и постепенно ще добавям нови, след като съм ги тествала и са ми харесали.

Цветове

Вземане на цветове от изображение

Color Cop e безплатна, интуитивна и лека програмка, която позволява да се вземат RGB и шестнадесетичните стойности на даден цвят от екрана само с едно щракване с пипетката.Цветът се копира автоматично в клипборда.

Генериране на градиенти

Ultimate CSS Gradient Generator e инструмент, чрез който могат да се създават градиенти по подобен на Photoshop начин директно в браузъра, без нужда от исталиране на допълнителни програми. Единственото, което трябва да се направи е да се избере типа на градиент и да се зададат желаните цветове и позициите им. Директно се генерира CSS или SASS(за използване в mixins посредством compass)

Цветови съчетания

Color Sheme Designer предлага подходящи цветови съчетация на базата на избрани 1,2, 3 или 4 цвята.

Шрифтове

Разпознаване на шрифтове

myfonts.com whatfontis

Два сайта, които рапознават шрифтове от снимка. Проверяват буква по буква и търсят прилика или съвпадение с базата им от безплатни и платени шрифтове. За целта трябва снимката да е с високо качество и с добър контраст между буквите и фона зад тях.За предпочитане е фонът да е бял или в краен случай едноцветен и буквите да са отделение една от друга (да не се допират или препокриват)."Whatfontis" предлага и добавка към браузъра за Firefox и Chrome.

Измерване и позициониране

Пикселна линийка

Pixel Ruler е инструмент, който позволява точно измерване в пиксели по хоризонтала или вертикала на всеки елемент на екрана.

to be continued...

Цветовете в уеб дизайна

В момента се подготвям за изпита по CSS и неминуемо ми се налага да задавам цветове на елементите. По принцип предпочитам да използвам шестнадесетичните им стойности. За по-специфичните цветове, разбира се, ползвам програмки от типа на Color Cop или Photoshop, за да получа точно същия цвят като искания.

За използване на основните цветове,както и просто за упражнение, е добра идея да се знаят 16-те основни цветови имена:

aqua, black, blue, fuchsia, gray, green, lime, maroon, navy, olive, purple, red, silver, teal, white и yellow

Освен тях има още 130 допълнителни цветови имена,поддържани от всички браузъри. А вече да избиране на конкретен цвят добра работа ще свърши този списък с шестнадесетичните кодове на цветовете.

Cross browser testing

So what's your favorite browser...?

Интересно представяне на браузърите

Склонна съм да се съглася, само лисицата си я представям по малко по-различен начин...

И още нещо по темата, което много добре обрисува нещата :)

Въпреки личните ни пристрастия обаче и дори това,че фактите говорят сами за себе си ( за справка и за тесване на вашия предпочитан браузър на този сайт), като уеб девелопъри сме длъжни да се съобразяваме и с чуждите браузърни предпочитания и да се стараем сайтовете да изглеждат доколкото е възможно еднакво добре.

В тази връзка ще споделя няколко сайта, които позволяват доста удобно тестване на сайта ни в различни браузъри :

Browsershots

Adobe browserlab

Browserstack

Netrenderer

и за тестване на мобилни устроиства :

Android emulator

Blackberry simulators

[CSS] CSS Presentation - Calculator

create a windows Calculator

Отново познатия калкулатор, но този път в програмистки режим.

На вид изглеждаше като семпла и лесна задачка, но истината е, че отне доста време докато се наместят всички детайли на правилните им места и с подходящите цветове. Остава само калкулатора да проработи, но и това ще стане като се стигне до javascript :)

HTML

CSS Styles