New blog location
Francisco Garcia
3/22/2020
My blog has moved (awhile ago)
Go to https://www.franciscogarcia.me/
ā¤ļø
Promises pt 1 / ? š¦
Francisco Garcia
2/11/2019
Promises have their own kind of hell. And it's almost as crazy as callback hell.
Writing DAO and Manager layers in Node.js with promises has been some adventure. I'm going to talk through a simple get request for some photos with tags and demonstrate my process and pain points. Hopefully any reader (or myself) in the future can smack me in the face and say 'You dope! Just do [fill in better solution here]'
Here we go
A GET request comes through the /photos controller and triggers a method call. This method is called getAllPhotos(). Now, because we are in a Node environment, all of our DB communication must be asynchronous. In a Node environment, this is handled in one of three ways (really only 2 AFAIK):
1) Callbacks
2) Promises
3) async / await (still uses promises under the hood)
Now because we are using MySQL as our database, we have the mysql npm package installed for our database communication. By default this library uses callbacks to handle asynchronous actions. This can be changed using the util.promisify function off of the util package that you get when working in a Node environment.
So with that being said we can move on to the manager for this entity.
the manager returns a Promise which will resolve at some point. This is the key to asynchronous development in Node.js using promises. The method, if it requires async work, must return a Promise. Business logic can be placed within the promise and when a result is recieved, it can be passed into the resolve method exposed by the Promise. So this basically is saying everything past the controller has to return a promise. If not, it can't have any async method calls otherwise they will not work as expected.
So within our promise, we call a function getAllPhotos() from the repository. This returns a promise to some entities.
I know im jumping around but here are our entities.
A Photo consists of
ID, url to the photo, owner of the photo
A Tag consists of
ID, tag name
We have a table mapping the 1-N relationship between a photo and a tag. We will call this PhotoTag
So here is our plan:
1) Grab the photos
2) Grab the PhotoTag entries for each photo
3) Extract the tag IDs from the PhotoTag entity for each photo
4) Grab the tags with the extracted tag IDs
5) Attach the resulting tags to the photo view model and add the view model to a list.
This series of operations results in code resembling a level from Mario Maker. No joke.
And to signify the end of this entire operation we have to compare the lengths of the view model list and entity list, and once they are equal we know to resolve the view models.
There has to be a better way!
If you guys know of one please let me know. This results in a pretty quick query but I know there is room for improvement. As I continue to grow and learn more about promises and asynchronous programming I will probably look back at this code and cringe...
Stay coding everyone āļø
Got my tags working š¤¤
Francisco Garcia
2/8/2019
𤤠𤤠𤤠Had a great day today! Got my blog in a great spot [ i think ] , and a good friend helped us learn a lot about having our own business and key insights on performing at a top level from the beginning. This is just the start to our endeavors! I think whats left for me as of right now is polishing up some code for this project. I want to refactor to make the codebase cleaner and more easily maintainable. And its good practice if I ever have to do it at work. A lot is going to come from the things we've learned today. I'm excited for the future and what it will bring! Peace and love everyone ā¤ļø ā®ļø
From mobile!
Francisco Garcia
2/6/2019
Iām being annoying at this point but, cmon! This is so cool! š from my phone I can blast emojis left and right šš Time for some well deserved sleep š¤
My First Post....again!
Francisco Garcia
2/5/2019
first
firebase
authenticated
woah
Holy guacamole! It freaking works. Took me long enough š. I've had a few things come up in my personal life that hindered development out of work, but I sat down today and made time to finish this. The UI is..... honestly not much better. I mean, its not the firebase console, and I have a text area instead of an input box, but I want more. I was looking into draft.js [ https://github.com/facebook/draft-js ] , as it seems to have more of that text editor feel that a blog should have. I also want emojis. Depending on how customizable draft.js is, I could add it as a toolbar or something. In any case, Ill update the interface to this and make it nicer for me to use. I wanna take time on my tiny platform to thank everyone working on the Firebase platform. For making such an easy to use api that even a slowpoke like me could pick up š¤”. Cheers everyone!
š„š
Francisco Garcia
1/20/2019
I'm officially done. Like a burnt cheeseburger. Firebase, you are amazing. You offer a suite of tools for setting up an application without writing a single line of server code. This includes authentication, storage of static files, a database system, cloud functions and even a machine learning kit. But you just don't make the cut when it comes to a blogging interface (not that you were trying for it anyway). So, with that said, I start my integration of authentication into my blog/portfolio site. Using firebase should play nicely with my current setup. And it will give me a chance to design a nice UI for my blogging. Something personal, made just for me āŗļø. Possibly full of emojis. I'm addicted, what can I say?
To CSS-in-JS, or not to CSS-in-JS, that is a mouthful
Francisco Garcia
1/15/2019
Bleh. I'm still blogging from my dirty firebase console. Who knows how long it will be until I get an authenticated front end setup for this. In the mean time, ive made improvments to the UI. The app is pulling my blog posts successfully, so styling them is next on the agenda. I'm torn on wether I like CSS-in-JS. It allows for the component to be fully encapsulated and I can programmatically adjust styles based on props which is a huge plus. However, I like the light look and feel of a SASS project. Imagine going into your Javascript / TypeScript file and only seeing code as opposed to CSS. Not having to think in multiple technical dimensions makes development much simpler and quicker in my opinion. But for this, I'm gonna use styled-components. I figured it suits my needs and as long as things are placed in a proper order within the file, you can limit your exposure to relevant information. That's all for now, sorry for the short post. I'm back in the grindstone. Or is it back to the grindstone? EDIT: It's back to the grindstone š¤¦, guess I need a lesson in uncommon idioms
Hello_World
Francisco Garcia
1/13/2019
Hey everyone! This is my first blog post. Kinda inconvenient to make, as im blogging from the firebase dashboard. But it will suffice for now. I am excited now more than ever to push myself out there and start marketing myself as a freelance / contract developer. I would love more than anything to be able to provide value to an individual or company while supporting my family. I hope you enjoy the content and reach out to me, even if it's just to say hello! (: