Walls.io-Logo
Walls.io-Logo
Walls.io-Logo

Tales of an Intern At Walls.io

Nikolas Shares His Lessons Learned

Loading Logo
Young man sitting in front of a computer and a laptop.

This summer, Walls.io had its very first intern, Nikolas. During his time with us, he developed a very helpful tool and documented his creation process. Below you’ll find a summary written by Nikolas about the steps he took to create a Quick Admin Tool.

A brief step-by-step tutorial — Quick Admin Tool (QAT)

1. I started by creating a simple layout with HTML, bootstrap and CSS, following the mobile-first principle.

Screenshot of a quick admin tool developed by a Walls.io intern.

2. I made a JavaScript file and gave the buttons some actions.

3. I started using the API and loaded new Posts into my card.

Screenshot of code.

4. I filled the card with new content when the A button was pressed.

5. Tried to change the post’s visibility status by pressing the according button, which did not work by CORS-Policy:

Cross-Origin Resource Sharing (CORS) is an HTTP-header based mechanism that allows a server to indicate any other origins (domain, scheme, or port) than its own from which a browser should permit loading of resources.

6. I fought with CORS-Policy for several days till I gave up, UNTIL Michael’s unbelievably awesome Proxy-server finally bypassed CORS (at least in chrome).

7. Now, every 10 posts, a new GET request is sent. The data will always be before the last data, which means you will never get the same content twice. When you’re at the end of posts on your wall, it will start again from the beginning. As everything worked up to this point, I proceeded to work on the swipe-logic.

Screenshot of a quick admin tool developed by a Walls.io intern. On the left, the image shows an API token. On the right a photo of laptop, ipad and iphone.

8. As I could not make a swipe-logic myself, I copy-pasted one, thinking it would be that easy.

9. After struggling for three days, I eventually had a working swipe logic. It works by having two cards. Swiping the card away will make the card go behind the other one, and its content will be filled with new post-data. This goes on forever. Here it is (part of it):

Screenshot of code.

10. Configured the buttons to work with my new swiping cards (again, not all my code).

Screenshot of code.

11. Fixed some more small issues and changed the access token section to hide when entered or when it’s already in the URL.

Screenshot of a quick admin tool developed by a Walls.io intern.

Finished project

There are still some minor bugs, but other than that, it works pretty well, and I’m happy with what I learned and made. The Quick Admin Tool is publicly available here.

Related blog posts:

How to Create a Branded Social Media Feed | Design Tutorial (written by Nikolas!)