So... I coded my CV
So... I coded my CV. I know, I know, not the most revolutionary piece of programming. But I want to stand out in this industry and I thought it would be interesting. A piece of paper with lists of accomplishments and jumbles of words, identical to hundreds of others is not going to cut it. So, I used my skills in app development and now my CV lives on my phone and my laptop, ready to download and view anytime. Well, how did I do it? This is the process I went through to code my CV.
I wanted to use a language I had little to no experience with. I already had great knowledge of java and coding in Android apps. But I am a massive IOS user so coding in Java would have been pointless. My solution was to teach myself React Native. Just because I use IOS, I couldn't guarantee all of my employers would be. React Native isn't operator specific so can be used on either device.
Before I talk about my experience and the process of actually coding in React, I thought I'd first talk about how it works and the pain of trying to set it up. So unlike other platforms like Android studio or visual studio, you don't have to use a virtual device or connect your phone with a wire. It works through setting up a server on your pc. I downloaded an app called Expo onto my phone which can connect to my laptop. It searches for the Expo server running on my laptop and then I can launch my app through that. However, actually creating this server was beyond me; it took so long to work out! I had to download npm via the terminal (which I didn't even know was a thing when I started). I then created a new Expo project and started up my Expo server. You can use any studio to code in but I went with Atom as there isn't a lot of constraints and extra tools to use it was more simpler. I connected my projected up to Expo by saving it in the project file. And BOOM! My little Hello World App was on my phone ready to go. One of my favourite parts of using Expo is updating the app. Instead of having to reboot the app and start up again, I just have to save and shake my phone (yes, shake my phone!) and the app updates automatically. It was so easy and looked super cool as well!
But I still had to teach myself React Native. I learnt the basics; played around with designs and basic functions like buttons and inserting photos. I read blogs on how to code and taught myself as much React Native as I needed. I thoroughly enjoyed learning this new language and watching my code develop into something I could actually use. But this was just a rough piece of code, I hadn't even begun thinking about my first IOS app. So, what was next?
I began designing. I knew what I could achieve with my basic knowledge; so I designed a more challenging concept. I wanted to stretch and test myself. I just love a challenge! So this was my concept; A startup page with a photo of myself, my contact details and a brief introduction; my work experiences and references; my achievements; my interests; and my qualifications and predicted grades. I wanted it to be bright and fun to reflect my personality. I also had this sort of tinder style card swiper motion in mind which I knew would difficult but interesting to try and achieve. I already have a paper-copy CV though so I didn't have to spend time writing a whole CV just updating it for this new version. As much as I enjoyed the design process, my passion is coding and I couldn't wait to get started.
So I started with a simple list of the most important things I wanted to achieve. I needed all the information on there, a few different pages with images and some sort of navigation between pages. That's how I started and I built up from there. I added a navigation bar between all my different pages instead of just a basic looking button and inserted a photo of myself at the top. I designed some simple icons for my grades and played around with the layout of the page to give me these columns. However, I quickly realised I had too much information! Especially with my experiences and interests, they didn't fit in the box I'd designed. My solution? I created a scrollable view. This was my first step out of my comfort zone. Everything else I sort of knew how to do and if I didn't I managed to work it out. This just did not work for me. Because of my card-like window, the information was in, I couldn't work out how to make the text scrollable and not this view. I was stuck for ages! In the end, it was rather simple. All I had to do was move the scroll view inside of this window. That way it was the actual text moving, not the whole block. It was so frustrating but I'm glad I persevered instead of just compromising.
Now as I mentioned before, I really wanted to try this swiper idea. I felt like it would look like turning a page as well as online dating for a potential employee! However, there weren't a lot of tutorials on how to do this. There were a few add ons that were swiper navigations but hardly anything explaining how to achieve what I wanted. My problem, like above, was trying to get the navigation to only affect the white box, not the text or the whole page. I also struggled to create a navigation that didn't affect the tabs at the bottom or overwrote the main navigation. So, how did I do it? I found a sample piece of code that I meticulously analysed and went through... And it wasn't exactly what I wanted. But it helped me work out, just like my scroll view, it had to go round the view instead of inside. That was actually a lot easier than I thought, it was harder finding a tutorial.
So the whole app did take months; this wasn't a quick process. Especially because I was also juggling school at the same time. This was more of a hobby and something I did when I had time. It was also rather time-consuming when I had a problem like the ones I have mentioned above as I had to spend time researching and teaching myself. However, I loved it! Watching my ideas come to life through my own hard work and determination was amazing. React Native is now my favourite language to code in as it was so fun watching all of my family and friends test it out on all there devices and actually be able to use it.
My favourite part of the whole process? I'm really not sure especially as this took several months so my favourite parts changed over time. I actually think, despite how annoying they were, it was all the mistakes I made. As cringe as it is to say, this was such a great learning experience. Especially the challenging aspects like the navigation and even just inserting a photo right at the beginning were extremely interesting to me. Also just finally seeing the finished project and to know how much hard work had gone into it was amazing. And can I even say it's finished?
There are so many things I want to add. Obviously, to begin with, I'm constantly trying new things that I can add to my achievements and interests like this blog for example. So I guess the next thing is learning how to update my app to everyone who has it. I also want to be able to export it properly, not just through the app or my laptop. But I think that's more of a backend, follow a tutorial kind of job. Coding wise? I would like to add a link to this blog and also change some of the images to more recent examples. But, here is my app so far in the 'complete' form:
Overall, this was an amazing experience that was so much fun and was a great first project. I'd like to continue my new skills in React by coding some apps that explore my passion for Tech for Good and also challenge me even more!
I wanted to use a language I had little to no experience with. I already had great knowledge of java and coding in Android apps. But I am a massive IOS user so coding in Java would have been pointless. My solution was to teach myself React Native. Just because I use IOS, I couldn't guarantee all of my employers would be. React Native isn't operator specific so can be used on either device.
Before I talk about my experience and the process of actually coding in React, I thought I'd first talk about how it works and the pain of trying to set it up. So unlike other platforms like Android studio or visual studio, you don't have to use a virtual device or connect your phone with a wire. It works through setting up a server on your pc. I downloaded an app called Expo onto my phone which can connect to my laptop. It searches for the Expo server running on my laptop and then I can launch my app through that. However, actually creating this server was beyond me; it took so long to work out! I had to download npm via the terminal (which I didn't even know was a thing when I started). I then created a new Expo project and started up my Expo server. You can use any studio to code in but I went with Atom as there isn't a lot of constraints and extra tools to use it was more simpler. I connected my projected up to Expo by saving it in the project file. And BOOM! My little Hello World App was on my phone ready to go. One of my favourite parts of using Expo is updating the app. Instead of having to reboot the app and start up again, I just have to save and shake my phone (yes, shake my phone!) and the app updates automatically. It was so easy and looked super cool as well!
But I still had to teach myself React Native. I learnt the basics; played around with designs and basic functions like buttons and inserting photos. I read blogs on how to code and taught myself as much React Native as I needed. I thoroughly enjoyed learning this new language and watching my code develop into something I could actually use. But this was just a rough piece of code, I hadn't even begun thinking about my first IOS app. So, what was next?
I began designing. I knew what I could achieve with my basic knowledge; so I designed a more challenging concept. I wanted to stretch and test myself. I just love a challenge! So this was my concept; A startup page with a photo of myself, my contact details and a brief introduction; my work experiences and references; my achievements; my interests; and my qualifications and predicted grades. I wanted it to be bright and fun to reflect my personality. I also had this sort of tinder style card swiper motion in mind which I knew would difficult but interesting to try and achieve. I already have a paper-copy CV though so I didn't have to spend time writing a whole CV just updating it for this new version. As much as I enjoyed the design process, my passion is coding and I couldn't wait to get started.
So I started with a simple list of the most important things I wanted to achieve. I needed all the information on there, a few different pages with images and some sort of navigation between pages. That's how I started and I built up from there. I added a navigation bar between all my different pages instead of just a basic looking button and inserted a photo of myself at the top. I designed some simple icons for my grades and played around with the layout of the page to give me these columns. However, I quickly realised I had too much information! Especially with my experiences and interests, they didn't fit in the box I'd designed. My solution? I created a scrollable view. This was my first step out of my comfort zone. Everything else I sort of knew how to do and if I didn't I managed to work it out. This just did not work for me. Because of my card-like window, the information was in, I couldn't work out how to make the text scrollable and not this view. I was stuck for ages! In the end, it was rather simple. All I had to do was move the scroll view inside of this window. That way it was the actual text moving, not the whole block. It was so frustrating but I'm glad I persevered instead of just compromising.
Now as I mentioned before, I really wanted to try this swiper idea. I felt like it would look like turning a page as well as online dating for a potential employee! However, there weren't a lot of tutorials on how to do this. There were a few add ons that were swiper navigations but hardly anything explaining how to achieve what I wanted. My problem, like above, was trying to get the navigation to only affect the white box, not the text or the whole page. I also struggled to create a navigation that didn't affect the tabs at the bottom or overwrote the main navigation. So, how did I do it? I found a sample piece of code that I meticulously analysed and went through... And it wasn't exactly what I wanted. But it helped me work out, just like my scroll view, it had to go round the view instead of inside. That was actually a lot easier than I thought, it was harder finding a tutorial.
So the whole app did take months; this wasn't a quick process. Especially because I was also juggling school at the same time. This was more of a hobby and something I did when I had time. It was also rather time-consuming when I had a problem like the ones I have mentioned above as I had to spend time researching and teaching myself. However, I loved it! Watching my ideas come to life through my own hard work and determination was amazing. React Native is now my favourite language to code in as it was so fun watching all of my family and friends test it out on all there devices and actually be able to use it.
My favourite part of the whole process? I'm really not sure especially as this took several months so my favourite parts changed over time. I actually think, despite how annoying they were, it was all the mistakes I made. As cringe as it is to say, this was such a great learning experience. Especially the challenging aspects like the navigation and even just inserting a photo right at the beginning were extremely interesting to me. Also just finally seeing the finished project and to know how much hard work had gone into it was amazing. And can I even say it's finished?
There are so many things I want to add. Obviously, to begin with, I'm constantly trying new things that I can add to my achievements and interests like this blog for example. So I guess the next thing is learning how to update my app to everyone who has it. I also want to be able to export it properly, not just through the app or my laptop. But I think that's more of a backend, follow a tutorial kind of job. Coding wise? I would like to add a link to this blog and also change some of the images to more recent examples. But, here is my app so far in the 'complete' form:
Comments
Post a Comment