This pop-up modal was a response to a short technical interview received, and given 5 days to complete. In this techical interview, I was given an image to recreate using HTML5, CSS3, and jQuery, and given the option to host this code through a site like jsfiddle, or my own server (I chose the latter for an extra challenge as I had not yet done so before).
At the time of receiving the technical interview prompt, I knew nothing about Javascript, let alone jQuery (or CSS for that matter). My plan was to use the first day alloted to watch tutorials and understand what exactly jQuery was, and how I could use it to recreate the given image. Ultimately, the project took me <1 day.
The first step was gathering design resources. I needed to find a font that looked similar to what was in the image. While it is not an exact replication, it is an assumed similar font family on first glance. The two shade background was created in Adobe Photoshop, with similar shades to the original (not noticable in image due to slight opaque overlay onnce modal fades in.
Once realizing where jQuery shines in it's straightforward syntax, it was easy to understand quickly. I opted to research the code I needed to allow for a few second delay beofre the modal fades in. As a first attempt at jQuery, I found it to be fairly simple (The CSS could use some work though!). I chose to keep in the flaws after-the-fact, to remind myself of the stress that ensued due to my hastiness, and to pay more attention to detail in my future technical interviews.
I have featured this project to showcase my ability to quickly pick up new langauges in a short amount of time. Jumping right into a language without understanding the concept and use cases behind it can lead to an arduous and frustrating process. While this pop up modal was not a spiting image of what was provided, it taught me how to learn quickly and efficiently, how to host a website on a server, and ultimately landed me the internship.