Last active
April 20, 2017 19:31
-
-
Save becckitt/4b999b904911f540626f06e94ed2a632 to your computer and use it in GitHub Desktop.
Process for Ad Tracker
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Process Notes | |
Why choose Vue? | |
- First, why choose a framework at all? This app is super tiny and not very complex, but it’s just complex enough (and, also, I can imagine it fitting into a larger ecosystem one day) so building it within the structure of a framework makes it easier to manage and maintain | |
- Vue a light framework, and this is a tiny app. Good to be able to choose which pieces you need vs having to load an entire framework | |
- It’s well maintained, has good performance, and seems intuitive | |
- Seems kinda irresponsible to bring another Angular app into this world | |
Beginning Steps: | |
- Reading a lot of documentation | |
- Reading tutorials for putting together a Vue app, to get a sense of how they’re built in the real world | |
- Putting together a basic app, testing out the framework with small elements (like auto filling the title and subtitle) | |
- Normally would have started adding tests here, but wanted to give myself some room to play around with the framework first since I was still learning, before writing tests that commit to structure | |
- Planning out design, which pieces should be components. Articles and ads seem like good candidates for being components. | |
Next steps: | |
- Adding more meat to the app (building out ad post request functionality, and where I add in the Vue Resource, a Vue plugin for web requests) | |
- Okay now it’s time to add tests | |
- Tests are failing | |
- Okay tests are passing | |
- Moving onto adding the analytics: I want something like what would be a model in Angular, but don’t necessarily need a full component. Do some research, and find out about global event buses, which allow you to send info between components that don’t share a parent/child relationship. Note: I am not sure this is the completely right answer, but it is the best answer I have for now | |
- Build out the methods for gathering the session data. Each component should be responsible for sending its data to the event bus, so I build out the methods for each in the corresponding component's file | |
- I have an idea of how to build out these methods, but for a couple (ex: getting scroll depth) I do some research/googling to make sure my thinking is right. (it mostly is, but I learn a few things about page heights. Did you know there are ~3000 different ways to find various heights on a page?) | |
Future steps: | |
- Finishing the app (lol) | |
- Add tests for the user session data in the Ad/Article components, to make sure they're working | |
- Fix those methods, plus clean them up | |
- Code out the post request in session data to send the user session data back to the server | |
- Read more of the documentation, pretty sure I made some mistakes since this was my first time using Vue | |
- Refactoring/ cleaning up |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment