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.
3. I started using the API and loaded new Posts into my card.
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.
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):
10. Configured the buttons to work with my new swiping cards (again, not all my 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.
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!)