A FreeCodeCamp project to mimic some of the features of the Pinterest image website.
User Story: As an unauthenticated user, I can login with Twitter.
User Story: As an authenticated user, I can link to images.
User Story: As an authenticated user, I can delete images that I've linked to.
User Story: As an authenticated user, I can see a Pinterest-style wall of all the images I've linked to.
User Story: As an unauthenticated user, I can browse other users' walls of images.
User Story: As an authenticated user, if I upload an image that is broken, it will be replaced by a placeholder image. (can use jQuery broken image detection)
The biggest issues I ran across was with designing details about each page, setting up twitter and utilizing popup windows.
I've found that deciding on how a website would function is more difficult than a person would think. Mostly because of the several steps you must consider when creating a webpage.
My solution has been trial and error, learning from previous mistakes and utilizing story boards, stepwise approaches and talking/writing it out to think through the processes.
There are dozens of ways in which a person might implement twitter and other social media. Researching and reading through peoples tutorials or stacks overflow can lead a person down confusing paths.
In the end my solution was to rely upon the passport.js "how to" with twitter. Now if I can only go back and get those three hours back to my life.
I can tell that I have a lot to learn. Specifically with the nature of JQuery and how it interacts with other code. Perhaps I ended up getting tunnel vision but there were
a few instances when I didn't understand why HTML and the JQuery code had to be placed in such a way in order for the popup to work. The solution was to not stay focused on the organization of CSS and JQuery Events.
For JQuery I discovered that using onClick="myFunction(this);" and onerror="myFunction(this);" would be very useful.