The Creation of MixedKennelClub - the Construction

Presenting the following information in a list format makes it more readable and allows me the flexibility of continuing to add new things until it is finished.

• Although I have majored in computer science and even specialize in networking, I am not familiar with web development. After some initial research, AMP (Apache + MySQL + PHP) was a no-brainer; and I decided to use the MacBook abandoned by my wife instead of Windows for development.
• I searched resources and found "Build Your Own Database Driven Web Site Using PHP & MySQL, Fourth Edition" by Kevin Yank that is serving me as a tutorial. I have taken database courses and learned about SQL, but I hadn't played with MySQL. Also, I knew what PHP is but I had never played with it. I have some basic knowledge on HTML and CSS which is also helpful on this project.
• Database design is an important part of my project. I designed the relational database, and asked my friend working in Facebook to have a look. Based on his suggestions and my own ideas coming from his suggestions, I made further improvements on it.
• The framework of the information on the website would be providing a pure breed name list. Then the user will be able to select two different breeds to find the information of the target mixed breed, or add a "card" of their dog for the mixed breed. The "card" will contain some dog information, and more importantly, the card originator will describe their dog's appearance and temperament, respectively, like a "tag", so that each mixed breed would have a tag-cloud.
• StackOverflow is a wonderful website for learning and asking questions as you go. All of my questions have been answered within a period of short time, and most of the answers are helpful. And two times when I was typing the question, I figured out the solution by getting my ideas outside my head and organizing them for presentation to someone else. This is one of the amazing powers of writing down your thought or telling someone your thoughts. Once you get them where, you can see them more clearly and you can then sometimes see the flows or holes in your thinking and connections of ideas.
• My wife helped me collect information on pure-breed dogs from Wikipedia. I created the dogbreed database table and recorded this information. I finished the page showing the list of pure breed dogs. Also, I finished the page presenting the information on individual dogs. Art design is pending, and might be my wife's job (I will take care of CSS, for sure). Some functions/features are already implemented:
• Popup frame for individual pure breed dog information. I prefer popup frame rather than a new page, because my focus is on mixed breed dog, so very little information is provided.
• Using AJAX to implement search word hint.
• Search.
• I am thinking about Metro-style display for pure breed dogs.
• I finished the user registration and login pages and function (but had trouble with PHP session). I was originally afraid user registration would become an obstacle to the website. However, I need the function of editing mixed breed card for users. It can't be a wiki-like that everyone can edit, as only the owners of the dog will have the privilege to do that. Thus each mixed breed card requires a password and functions so the user registration and login were eliminated.
• I created a page called mixer so the user can choose two breeds. Also it can be chosen from a pure breed dog page whenthat one of the parents is selected. I provided two options for user to select pure breed: type-in like search, and select from the combo box.
• (for geek) I used global variable to load the data upon loading the window, which I know is bad. Then I decided to load the data to the combo box upon loading the window and discard the global variable; and also I synchronized the input box and the combo box using JavaScript.
• A default breed image. LOL!
• I created the mixcard database table, created the form and function to add a card, and the page to show the cards.
• Tag is pending.
• Yesterday, I read the Google style guide for C++ and JavaScript (there is no guide for PHP and HTML, though). I really enjoyed reading them because I have such OCD. Then I updated the entire project following these instructions from Google (which is also the reason I discarded the global variable).
• If I update my resume, I think I can update "knowledgeable on PHP, MySQL, HTML" to "familiar with PHP, MySQL, HTML", after 10 days of working with them. I am still not very familiar with JavaScript, since I have not used it a lot.
• Nov.7. I wrote the blog (yet to publish) to catch it up with all I have done in the 10 days. And I will keep updating it.
• I finished adding and editing basic cards, but there are still some bugs.
• Nov.8.
• I worked on adding and editing cards, fixing bugs.
• I added the fade-in and out prompt feature. 
• This is also the first time I learned about Post-Redirect-Get pattern, but didn't have to use it in my website, yet.
• Nov.9. I created the database table cardcomment, and begin to add the commenting feature. I learned that AJAX is a preference, but I am not sure whether implement it from the beginning, or to implement a simple one and improve upon it.
• Nov.10. I finally figured out what AJAX is and how it works. The comment system is basically finished. I can now start to do some low-tech things, such as picking and downloading pure breed dog pictures.
• Nov.11. I proceseds dog breed pictures.
• Nov.12. The pure breed list is updated, using animation of jQuery. I find jQuery is very useful, and I have started to substitute all JavaScript function over to jQuery.
• Nov.13. jQuery to mixbreed pages.
• Nov.15. I updated the comment system. I am really having trouble figuring out the bug from jQuery and CSS. I also started to work on the picture uploading part.
• Nov.16. I worked on picture uploading. I changed the method for inputting the password and edit/upload.
• Nov.17. I finished the picture upload/edit/delete, caption edit. I started to work on tags, using jQuery plugin "tag-it", which is easy to integrate.
• Nov. 18. I created the database table dogtag and tagcard. I finished adding and editing the tag. With the help of jQCloud, the display of tag cloud is finished in 30 minutes. OMG, jQuery is so useful! All the basic functions are done! And... Let's Now - start the art part!
• Nov. 19 - 22. I designed and implemented the frontpage, under 960 Grid System, using various tools like OmniGraffle, InkScape, GIMP. GIMP is really user-unfriendly, and in my opinion cannot compete with PhotoShop.
• Nov. 23 - 24. I updated the pure breed list using jQuery UI tabs. The pure breed page is finished.
• Nov. 25 - 26. I updated the mixer with new CSS, and made a navigator panel. The mixer page is finished. I updated the mixed breed page, and redesigned the layout.
• Nov. 27. I utilized jQuery UI tabs for each mixed breed card. I redesigned the add card form, which is now finished.
• Nov. 28. I updated the comment tab, which is now finished. I updated the picture tab, using jQuery gallery plugin.
• Nov. 29. I fixed the picture align bug. I updated the edit form, then merged it with the add form.
• Nov. 30-Dec. 2. I finished the basic add/edit form. I updated the picture add/edit form.
• Dec. 5. I updated the mix card, which stores the dog's birth year and month instead of its current age. I finished the mixed breed page. I staredt and finished the feedback page, but the mailing function was not working, I need to try again when I get the web host. I started the about us page and is finished.

So, the first round, or say, the alpha, MixedKennelClub is finished!

• Dec. 6. I bought the web host with the free mixedkennelclub.com doman name from Bluehost for $60 a year. There was a four-hour outage and I didn't do any other thing.
• Dec. 7-9. I realized the cross-system, cross-browser issues. So I used W3C validator to check the page, and started to fixed cross-browser bugs. I always thought IE7+ was not that bad when using them, but now I totally understood why IE is said to be crap. Many basic standards are not supported, so it costs a great effort for web designers to compromise IE. I have latest Chrome, Safari, Firefox, Opera, and IE9, Firefox 3.6 (last version before the big improvement from 4, still have 5.6% market share) installed on my Windows 7 computer, and I also tested IE8 on my wife's Windows XP computer. After I have done cross-browser configuration, I rank these browsers as: Chrome=Safari>Firefox 8=Opera>IE9>Firefox 3.6>IE8>>>IE6.
• Dec. 12-15. I started to create the mobile version site. I resized images, removed some fancy feature, and the gallery plugin.
• Dec. 16. I finished mobile version design: m.mixedkennelclub.com. I also applied for ad posting, waiting for response.

And so, the second round, beta MixedKennelClub is finished!

The Creation of MixedKennelClub - the Idea

Today is November 7th, 2011. It has been 10 days since I started to create my website. Today I decided to record this process. I will post this blog after I launch the website. I am writing in English because I will also post in English on the website.

Ten days ago, I was working on another startup project, which my wife, her retired boss and husband (who are also my friends) will collaborate to create. And I was, of course, taking care of the IT part. Basically, I wanted to use JavaScript and HTML5 canvas to process an image automatically, which will be further transferred to product for sale. But after I had worked for days on it, I felt the potential for automatic processing had come to a dead end, and that manual processing would be inevitable.

Then I chatted with a college classmate online, who told me that he had developed a Windows Phone App and earned $120 per month from it. In a previous conversation with him, I said I wanted to develop an Android App but I couldn't come up with any sound app idea. Well, he did, and I am happy for him that he is even making money from it.

This inspired me, or more accurately, stimulated me. I talked to my wife and felt that the current project between us and our friends was beyond my current capability, and I first need to work on a simpler project, in which earning money is not priority. Therefore, I dropped the project with my wife and our friends, which is still possible but the part, involving transferring from one medium to the product, is no longer my responsibility.

Time for more brainstorming on what this simpler project might be through which I can learn. Fortunately, my new idea came within hours. With this new idea, I believe a website instead of a mobile phone app is more suitable. The mobile app can be an extension after the website is functioning. Keeping in mind that making money is not my goal for this project, I really wanted to create something useful; and I will also put some ads on it to hopefully compensate me for the expense of web hosting. I searched the Internet and did not find a similar website. Even if there had been a similar website, I think the project is still doable. Therefore, I made up my mind to create this website. By the way, I am currently in the final year of my PhD program. Since I have also made up my mind to leave academia, creating this website will be definitely helpful for my industrial professional career.

My goal is clear and simple: to provide information about mixed breed dogs. Of course, my lovely Shiba Inu cross Havanese named Ichiro inspired me. There is a ton of information on pure breed dogs, and many organizations representing pure breed dogs such as FCI, AKC, CKC, KC, etc. There is a lot less information on mixed breed dogs. One site, www.dogbreedinfo.com provides a list of mixed breed dogs, but it is not complete (there is no Shiba Inu cross Havanese) and it is Web 1.0. This of course means there is no way I can add my Ichiro's cross breed of Shiba Inu cross Havanese to it. This inspired me to create a UGC (user-generated content) Web 2.0 (oh gosh, geek comes!). Okay in plain English: I want everyone who has a mixed breed dog to put their dog on the site and then to give some information, and share their thoughts. My motivation is to provide anyone wanting to become the owner of a mixed breed dog to have a place to go to learn about the types of mixed breed dogs they are considering, even as they could do for a pure breed dog. I want everyone to have a place to go that provides them with the research they need for them to make an informed choice before getting a mixed breed dog. This will allow them to be better prepared to understand and love their future baby.

My website's name: MixedKennelClub.