Creating Mock-Up Mobile Apps for a Personalized Experience

Sites like Sandbox.io, CodePen and Vue are all logical stops for the blossoming developer who's looking to do cool things like, I don't know, create mock-ups of popular social media sites such as Instagram. I'm not going to wax legal on this, but it's a cool side effect of visiting sites that people love and deciding to build your own third-party spin on it to add features that the actual company never gets around to. This is, of course, why there are so many mock-up mobile apps that stand in place of Facebook and other social media options that are cited to eat up memory, processing power and battery life.

Now, let's back up for a second a discuss how this Instagram mock-up was made. If you're experienced, you probably know about Vue, which provides a JavaScript framework inside which user interfaces can be created for apps and sites both mobile and desktop. Vue is one of the most popular options around for this purpose and synergizes wonderfully with CodePen, which is a platform where the results of your Vue creations can be shown off and used to help others learn and develop their own projects. A third option, which some cite as being even better than Vue, is Sandbox.io: a little slower at times but overall more reliable and well-rounded. However, that's all up to user preference.

As you'll notice in the Instagram mock-up, a few minor elements are missing such as the floating heart icon when you upvote a feed item. This isn't really a big deal, and we daresay that it makes for a nice personal touch. Otherwise, you can see just how functional that short strip of feed content really is. You can double-click the images to upvote or hit the little heart icon, but not much else can be done from here. Of course, it's not a fully functional example either; for example, clicking the heart icon will raise the likes counter on that image, but refreshing the page will reset it. Still, it's a good theoretical design, and who knows: Maybe you'll pull off a site of your own one day by copying a major one. For more information click here https://codepen.io/itslit/pen/OvZrvR.