Ajax Crawlable Demo за работа с динамични сайтове

Здравейте, отново е време да се захванем с някой нови интересни неща с които се занимавах тези дни.

Започнах нов проект за споделяне на събития.

http://bgjoin.com/

в сайта може да разгледате секция "КАК РАБОТИ ?".

Но да се върна към темата:

Технологиите, които ползвам за html 5, jquery, ajax, css и php за rest service.

По време на разработка на проекта  всичко беше добре, докато не стигнах до извода, че динамичните сайтове не се индексират от google.

Веднага се разрових в internet и открих решение на проблем става въпрос за:

how to make ajax crawlable

Ето и мое демо http://test.nh.zonebg.com/

Идеята на всичко това е, че когато зареждаме динамично сайта ние работим с # hash знака

и така с jquery прихващаме този селектор, но проблема е  че това се рендира при клиента 

и няма content които да бъде индексиран от google.

За целта от google са намерили решение, като след # добавяме и удивителен знак (!)

получаваме www.example.com/#!99 примерно 99 играе ролята на ID за да може после да се направим заявка и да се генерира content.

как става това.

google замества кобинацията от #! със ?_escaped_fragment_  което играе ролята на ключ за търсене в $_GET.

Примерно $_GET['_escaped_fragment_'];

но за да стане всичко по прегледно нека пусна и кода

Надявам се да съм бил полезен.

Ако имате въпроси пишете ми

Поздрави Мемхедов!

NodeJS пример четене от MySQl

Ех доста време си играх с това чудо, докато си направя прост
пример с който да покажа как се чете от база данни и как се обработва DOM

NodeJS пример четене от MySQl -
http://jakomen.chat.jakomen.jit.su/

И тук
http://chat.pmsys.org/

Ето и кода да се забавлявате
https://github.com/halachev/NodeJS-Example---MySql

Поздрави Мехмедов

Jquery  - кеширане на данни

Проблем

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

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

За целта реших да оптимизирам функционалността.

Системата ползва CouchDB База данни (NoSql) + Jquery и .net Service.

html5, css3 или по точно SPA(Single Page Application)

Решение на проблема

Интересното тук е, че се сетих да ползвам Cookies или local storage и в тях да пазя информацията за потребителя

(UserID, UserName), като само в началото при Login се инициализира всичко от сървъра и се складира в Cookies0, като Array от обекти представени в JSON формат.

Source Code

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

Поздрави Мехмедов!

Nurietin Mehmedov CURRICULUM VITAE

Понякога се налага да представиш себе си с няколко думи или пък да кандидатстваш за работа където CV-то е задължително( мотивационно писмо също но за него друг път).
Надявам се да помогна с моето CV на други хора които искат да си оформят тяхното CV

CURRICULUM VITAE

    Personal Information

Name: Nurietin Mehmedov

Position: Delphi (XE), Dot.Net Developer

Date of Birth: 20  January 1974

Marital Status: Single

Mobile Phone: (+359) (889) 25 05 02

Web Site: http://pmsystem.nh.zonebg.com/, http://xgridview.apphb.com/

Email: jakomena@gmail.com

Skype: jakomen

Education

1989 - 1992:        High School  “CPTU - Transport”, Kazanlak, Bulgaria

1981 - 1989:        Comprehensive Secondary School “Nikola Vapcarov”, Kazanlak, Bulgaria

Certification

     2011 -  2012    Mobile Applications Development “telerik academy”, Sofia, Bulgaria

2012 -  2012    Cloud Development “telerik academy”, Sofia, Bulgaria

2010 – 2011:    High School  “Europe” English  pre intermediate,  Kazanlak, Bulgaria

Employment Career

Jun 2005 – Present: Delphi, Dot.Net Developer for Software Development 

(David-Holding), Bulgaria – http://www.david-holding.com/

Oct 2000 – July 2001  C, C++ Developer for Software Development (SICOM), Bulgaria

Skills

Software project management

Software architectures

Object-oriented programming and modeling

Client-server technologies

Multithreading and thread synchronization

Internet technologies and networking

Web application development

Relational databases, database systems and database design

High-quality programming code construction

Windows network administration and maintenance

Operating systems – Windows,  DOS

 

Programming Languages

     Delphi, C#, Asp.Net, Java, C, C++, PHP 

            Web

                Html5. Jquery, CSS,  javascript

Software Technologies and Platforms

Microsoft .NET Framework and related technologies – C#, ADO.NET, Windows Forms, ASP.NET,  AJAX, Controls Toolkit, XML Web-services

Delphi and related technologies – Visual Component Library (VCL)

Database access – SQL, ADO, ADO.NET, stored procedures

Web sites and client-side scripting – HTML, DHTML, CSS,

JavaScript, Jquery, Mobile, JSON,

Internet protocols – TCP/IP, HTTP, HTTPS, SMTP, POP3, FTP

Socket programming – Winsock, C socket programming

Windows programming – Win32 API, COM, ActiveX, ODBC, ADO

 

Database Servers

Oracle Database (8, 9, 9i, 10g), Microsoft SQL Server (2000, 2008), MySQL (4.0, 5.0),

NoSql – database(CouchDB),InterBase (6.0) / Firebird (1.0), Microsoft Access (2000, 2003)

 

Application Servers

         MS Internet Information Server (5.0, 6.0), Apache (1.3, 2.0)

 

Development Tools

         Java and J2EE related – Eclipse, Eclipse Web Tools, Eclipse , Borland , Microsoft Visual C++

         related – Microsoft Visual Studio (6.0, 2002, 2003, 2005, Borland)

 

Other Skills

Team working skills

Communication skills

Organizational skills

Projects

Инструменти и машини

 Period: now

 Description: online store  

 Technologies: php, Html5, Jquery, Ajax, css 

 Url: http://simo98.com/

PMSystem

 Period: august 2012 – now

 Description: project management system   

 Technologies: Html5, Jquery, Ajax, Json, NoSql – CouchDB, JsonBridje

 Platform –  Widnows, IIS

 Url: http://pmsystem.nh.zonebg.com/          

           

Secret Comunicator

Period: Mart 2012 – now

Description: Cloud Application using NoSql - CouchDB

Technologies: WCF Service, Html5, Jquery, Ajax, Json

Platform –  Microsoft Visual Studio 10.

Url: http://secretcom.apphb.com/

XGridView  1.0

Period: December 2011 – now

Description: Server Control And Component Development

Technologies: dot.net, html, jquery, css,

Platform –  Microsoft Visual Studio 10.

Url: http://xgridview.apphb.com/

Supplier 1.0

Period: December 2010 – now

Description: Android Mobile business application

Technologies: java se, sqllite database, threading

Platform – Eclipse

Url: http://supplier.nh.zonebg.com/

Light Mp3 Player 2.2

Period: December 2008 – now

Description: Mp3 Desktop application version 2.2

Technologies: Mp3 encoding win32 API

Platform –   Delphi 7, XE

Url: http://www.softpedia.com/get/Multimedia/Audio/Audio-Players/Light-Mp3-Player.shtml

Auto zone

Period:  January 2011 – now

Description: Web page for auto mobiles version 1.0 Bulgarian Language

Technologies: PHP, java script, HTML, CSS, Jquery, MySql

Application Servers

MS Internet Information Server (5.0, 6.0), Apache (1.3, 2.0)

Url: http://nh.zonebg.com/

Research Interests

Object-Oriented Modeling and Software Design

High-Quality Programming Code Construction

Mobile Technologies

Database Development

Data Structures and Algorithms

Business Process Modeling

Languages

Bulgarian – native

English – fluent

Turkish – good

 

Въведение - FileReader HTML 5

Въведение

HTML 5, най-накрая, предостави стандартен начин за работа с локални файлове, чрез File Api.
Като за пример:
можете вече да имате thumbnail  preview на снимките, преди да се пратят към сървъра.

Четене на файлове

FileReader включва четири основни метода за четена на файл асинхронно.

FileReader.readAsBinaryString(Blob|File) резултата от тази функция е Blob

и binary string.Всеки byte е представен, като integer в range [0..255]

FileReader.readAsBinaryString(Blob|File) резултата от тази функция е Blob дата,

представена в текстов формат.

FileReader.readAsDataURL(Blob|File) резултата от тази функция е Blob дата encoded 

като data url

FileReader.readAsArrayBuffer(Blob|File) резултата от тази функция е Blob дата, 

като ArrayBuffer

един от тези методи се извиква за FileReader като event :

onloadstart, onprogress, onload, onabort, onerror,onloadend 

Следващия пример ползва reader.readAsDataURL() 

като генерира thumbnail  от избрания файл на потребителя.

html

 <form id="upload">
       <img id="uploadPreview"  width="75"/>
      <input type="file" name="file" />
     <button type="upload_image" id="upload_image" name="upload_image">Upload</button>
  </form>

javascript

var oFReader = new FileReader()

var oFile = document.getElementById("upload_image").files[0];

oFReader.onload = function (

                document.getElementById("uploadPreview").src = oFREvent.target.result;          

 };

            

oFReader.readAsDataURL(oFile);   

REFERENCES

• File API specification
• FileReader interface specification
• Blob interface specification
• FileError interface specification
• ProgressEvent specification

Поздрави Мехмедов!

Web Application с CouchDB база данни

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

http://en.wikipedia.org/wiki/NoSQL

А сега  какво направих за няколко часа 

https://halachev.cloudant.com/tasks/7c763e8ebc5db93220df2711bdfa06e1/index.html

Опитах се първо да извикам  view която имаше само една map функция на java script, но

се оказа че с ajax не може да се прави cross domain.

Ето как реших проблема:

създадох си база tasks в https://cloudant.com/

След което създадох нов документ и в него Upload-нах 

Index.html, Serve.js и Style.css

Използвани технологии:

Cloud computing - Html5, JQuery, Css, Ajax, Json

Поздрави Мехмедов

Бързо и лесно чат приложение - html5, jquery,PubNub

Създаването на чат в web се оказа доста лесна задача.Благодарение на една облачна услуга "PubNub" - http://www.pubnub.com/ 

Може бързо и лесно да си направите, чат приложение във вашата web страница.

Ето и разработено чат приложение от мен http://secretcom.apphb.com/Chat.aspx

Изисквания:
Познания с html5, jquery

Не забравяйте, да добавите следния код в body на html файла,
където pub-key и sub-key са задължителни.
След влизане в сайта вашия pub-key и sub-key ще ги намерите на :

My Account  ???

Api Keys ???

 <div pub-key="???" sub-key="???"
        ssl="on" origin="pubsub.pubnub.com" id="pubnub">
 </div>
 <script src="http://cdn.pubnub.com/pubnub-3.1.min.js" type="text/javascript"></script>

пример:
https://pubnub-prod.appspot.com/account-javascript-api-include
JavaScript Push API Reference:
https://pubnub-prod.appspot.com/tutorial/javascript-push-api

С  помощта  на Telerik - http://academy.telerik.com/

Практически проект - задание Secret Communicator (cloud development)

Здравейте, дойде времето в което трябва да разработим практически проект
Secret Communicator (cloud development)


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


Overview

Design and develop a cloud-based communication system for encrypted exchange of resources such
as messages, links and files. The communication is performed in channels. Each channel has name and
password. Users can enter existing channels and register new channels. When a channel is loaded, users
can see / download the content posted inside (messages, links and files) and post new content.


Architecture

Use the following classical multi-tier cloud architecture:
Front-End: HTML5-based client
Middle-tier: REST-based services
Back-End: NoSQL database + cloud storage



Създаване на проект - asp.net web application


И така първото което трябва да направим е да си създадем проект в Visual Studio
като изберем File - New - Asp.net web application


След това ще създам една папка LIB в която ще имам всички библиотеки които ще ползвам  за качване на файлове в DroobBox - https://www.dropbox.com/

Добавете към вашия проект - References - Add References - Browse - Lib
Маркирайте всички и изберете ОК


Тези библиотеки са:

Common.Logging
Divan.dll
Newtonsoft.Json.dll
nunit.framework.dll
Spring.Rest.dll
Spring.Social.Core.dll
Spring.Social.Dropbox.dll

Оказа се че целия процес ще отнеме доста време и ще стане доста скучно да описвам всичко стъпка по стъпа затова пусам линк към приложението където може да следите как се гради малко по малко  - http://secretcom.apphb.com

Изграждане на цялостно cloud приложение - Photo Sharer

Изграждане на цялостно cloud приложение - демонстрация (архитектура, изграждане на back-end частта, изграждане на бизнес логика в cloud среда, REST услуги, постраяване на HTML5 клиент)

В курса Cloud developmnt имах задача да се разработи cloud приложение.


Идеята беше за Frond-End да се ползва Html5, JQuery, Ajax
За база данни  - Back-End  NoqSq и DrobBox(https://www.dropbox.com/)
Бизнес логика на WCF Rest Service



ето сега и кода:


Upload на снимка локално




Резултат:
http://halachevphotosharer.apphb.com/

Излезе първа версия на мобилното приложение 

Supplier.Net (Cloud computing)

Може да изтеглите продукта от тук: http://supplier.nh.zonebg.com/SupplierNet.rar

Supplier.Net е приложение написано с технологиите "JQuery Mobile"
Html, Jquery (Rest Service) с бизнес логика на C# (WCF Application)

Ползва облачни услуги на App Harbor и MSSQl База данни.

Supplier.Net Ви дава възможност да добавяте обекти, артикули и категории.
Да правите заявки и да следите състоянието на всеки обект, артикул  количество и др.

В началото трябва да се регистрирате, за да може да създавате и добавяте обекти, артикули и категории от меню "Settings"

От Mеню "Requests" може да правите заявки към различни обекти да следите и проверявате, всяка една ваша заявка да редактирате, изтривате и др.

Поздрави Мехмедов!