Improving the Twitter Clone

This week was all about making the Twitter Clone better! Added a few exciting features including search, AJAX, hashtag highlighting… but on the surface it looks pretty much the same!

1. Objective:

What did you do this week?

On Monday, the lecture was about self-referential associations, so I understood a bit better how my code was working!! This was the essential structure for the Twitter “following” functionality which I implemented last week.

Tuesday was a midterm. Exams…remember those? We had to develop a web app within about 2 1/2 hours. It was pretty straightforward (with a couple of gotchas like custom routes and such), but thanks to Devise again for making authentication easy!

After logging in, the user gets access to more functions

We also learnt about using AJAX to refresh specific parts of the page. Honestly at this point it isn’t a huge change because our pages are pretty light on resources, but it’s good to know for the future!

And here’s my updated Tweeter App:

Homepage! Managed to make the tweeting function work like Twitter.

I was really excited about being able to make the hashtagging function happen in-line (just like it does in the real Twitter app) instead of the nested form from last week.

Was happy I managed to make the hashtag highlighting and hyperlinking work!

Also, this was rather difficult, but I managed to find a guide online that described how to use a JQuery plugin (Mark.js) to highlight hashtags (and make them into links).

Allowing the user to upload a profile picture
The user list showing the follow and unfollow buttons

Also, at the end of the week, I decided to redo the Twitter Clone (both to create a guide and to organize my code better). You can refer to it here!

2. Reflective:

How did you feel this week?

I felt I could have been more productive and done more things, but at the same time, I managed to hit quite a few road blocks and learn from them (e.g. ElasticSearch, Filestack, etc.). Also, having worked through the standard “bookmark style tags” (where the tag form is only available after the tweet is posted), then the nested form (where both the tweet and tag are in the same form, but in different textareas), and finally implementing the inline hashtag, it felt good and it was really educational.

3. Interpretive:

What did you learn this week? (not a lecture note) Any reflection, questions, and problems

Redoing the Twitter Clone from scratch was really educational! It was a lot cleaner because I knew which routes and methods were actually necessary. And it helped to consolidate what I learned over the past couple of weeks.

4. Decisional:

What are you going to do next week? (plan or goal for the next week)

Still need to finish up my controller specs! Also, haven’t decided if I will fully implement all the features from the Twitter Clone into the redone version. Might be a good idea to continue because I learnt a lot by redoing it from scratch.

Until next week, see ya!

--

--

Kenneth Teh
Kenneth Teh

Written by Kenneth Teh

Software Engineer primarily working with Rails and Vue.JS... sometimes DevOps and shell stuff too

No responses yet