That’s definitely a weird way to start a blog, but I’m running out of greetings. We’ve arrived at the end of this series. Thank you for following along. For this last post, I wanted to go over my thoughts about CS467 and my future career. So, let’s journey into my journey.
As I mentioned before, CS467 is a capstone course for the online postbaccalaureate computer science program at Oregon State University. I’m in the final few weeks and I wanted to reflect on this course. The structure of CS467 was that you worked on an approved project with two to three other students for the duration of this class. Along the way, you would have to do weekly blog submissions, weekly stand up discussions, a midpoint submission, a poster, and a final submission.
Looking back, I think I really enjoyed this course. I had two fantastic team members and we worked well with each other. At the end of this, we will have developed a time management system where employees can use QR codes to clock in and out. I got to learn how to set up a database on Heroku. I learned how to set up the tables in that database and how to create a backend with a controller and model format. After that, I was able to connect our backend to our front end using CORS and axios. Lastly, I learned Vue.js and created a few pages that displayed data from our database.
However, all of this wasn’t taught to me. I had to go out and learn it for myself. I think that journey of self-learning is what I enjoyed the most. I was able to learn these different technologies and apply them. There were a lot of problems along the way, but that’s part of the process. I’m thankful for this experience as I got to work on an interesting project with a great team. Not to mention, I learned that I actually enjoy working with the backend.
This is also my last semester at Oregon State University. If all goes well, I will have my bachelor degree in computer science by July. By that, I mean I hope I pass CS325 (algorithms). That means I’m going to be applying for a full-time job soon. I’ve heard a lot about this process and that getting the first job is always difficult. I have to admit that I do have some anxiety about this as I’m finally here… After 2 years of hard effort, I get to try a new career. I’m excited, but I’m wondering if I did enough. As I had to work full-time for most of the program, I wasn’t able to do an internship. For better odds, that means I got to have a solid resume, a GitHub portfolio with some cool projects, and experience with LeetCode.
After graduating, my plan is to develop my resume by looking at successful examples, add two more projects to my portfolio, and to have a strict regiment of LeetCode practice. However, I’m not too worried. I’ve always considered this program as an investment in me. I do have some faith in my abilities and I can’t wait to land my first software developer job.
Let’s talk about Vue.js. I know I’ve been delaying this topic for a while, but we can finally tackle some of it. We should probably start with how I learned about Vue.js. One of my group members asked about using Vue.js for the frontend as his work place used it. This was my first time hearing about it. I said sure, I don’t mind learning a new framework. However, I wasn’t really sure what I was getting myself into. I’ve only used react and simple HTML, CSS, and JavaScript for most of my web projects. To be honest, I felt like I didn’t really understand how to use these frameworks.
First thing I learned is that Vue.js is an open source JavaScript framework that is focused on the view layer or the user interface. It’s mainly used for building web applications or single page applications. Great, but how does it work?
To use Vue.js, we just used the following line in the terminal with Visual Studio Code.
npm init vue@latest
It goes through some of the options and will install the required dependencies for you. That was pretty easy. That’s also supposed to be an advantage in that this framework is pretty lightweight (relatively). Vue.js uses a component-based programming model and you can have separate components that make up the user interface. One thing I can say about Vue.js is that it’s really well documented. They have a pretty solid guide on https://vuejs.org/guide/essentials/application.html for what you can do with Vue.js.
To get technical, Vue.js has two great features. Paraphrasing from their website, Vue.js has a template syntax that allows an user to declaratively describe HTML output based on JavaScript state. It also automatically tracks JavaScript state changes and updates the DOM when changes occur. The second feature is pretty amazing and it allows you to do some great things.
As someone who is just getting into Vue.js, it seems like it’s easy to learn how to use it and it doesn’t have a steep learning curve. What I found difficult was learning how to use lifecycle hooks, but it wasn’t too bad. I’m going to tackle some features that I found interesting.
Starting from the beginning, each component generally has a script setup section, a template section where HTML generally goes, another script section, and a style section where CSS goes. For this framework, I think it’s important to mention that having a modular design really helps with making everything a bit easier. So, in the template section, I can do something like:
Based on the value of submitted, the success or failure line will be rendered. This is called conditional rendering and it has some great applications. It’s pretty easy to use in this context. It’s also possible to have a similar format where things are toggled on or off. The value of submitted will most likely be based on some JavaScript code in the script section.
Another interesting tool I learned about is PrimeVue. It’s a set of open source components for Vue.js that make some processes easier for the developer. It’s basically a library that helps with building user interfaces. A really great component from this library is DataTable. Using this DataTable, it’s easy to create a table that has pagination, scrolling, and sorting with just a few lines. The below picture has an example of a table I made with it.
However, developing projects with Vue.js wasn’t entirely easy. I did struggle with the script sections for most of my components. That probably says more about my JavaScript skills than the actual difficulty though.
The last thing I want to talk about is the different versions of Vue.js. The latest version is version 3 and that is significantly different from version 2. For example, you can’t use Vuetify to build a table with version 3. That’s why I was looking into alternatives such as PrimeVue. Another quick tip is that having a router can make things easier as you can move and push data from one component to another using $router.push. The router is also a significant component for single page applications.
Thank you for reading till now. That was a small introduction into Vue.js and some of its features. Next time, I think I’ll be talking about how I plan to start my career as a software developer.
I spent some time on trying to come up with a catchy statement and I ended up with hello there. Not my greatest work, but thank you for visiting my blog. If you’ve been following along, you might be confused with the title. You’re probably wondering why I’m taking about databases after I said I would talk about Vue.js in my last post… Unfortunately, I lied. Not intentionally, but I thought it was important to tackle the backend first. We will be tackling Vue.js in the next few posts though.
For our program, we are designing a employee clock in and out system based on QR codes. Applications can be usually divided into frontend and backend components. By backend, we’re referring to the server-side of the website where the application stores and arranges data. Generally, users of a website don’t interact with the backend directly. My task last week was to create a database and the required tables for our application. I thought this would be an easy task, but I realized that I was always given a database for most of my projects. Now, I would have to set one up. That’s when I realized …
However, it would be a great experience to learn how to set one up and I can always make a full-stack program in the future with this knowledge. Let’s talk about databases. Why do we need databases? There’s a lot of reasons, but the main one is persistent storage. We want someplace to store our data that’s permanent. For us, it’s going to user information and when users clock in and out.
There are two main types of databases. One is called relational and the other is document based. The more popular one is probably relational and it involves databases like MySQL and Oracle. These databases use a query language such as SQL and are pretty standardized. The data is organized in tables with the columns specifying what the data types are. The other type of database is document based and it involves databases like MongoDB, Google’s FireStore, and Amazon’s DocumentDB. The data is stored as JSON-like documents and similar documents can be grouped into collections. There’s definitely more types of databases out there, but these are the two major groups I wanted to focus on.
For our project, we went with MySQL. It was a database all the team members had experience with. My next question was how do I set up a database and how do I interact with it. This is where a team member was able to help me out. He recommended Heroku. Heroku is a cloud platform that supports multiple languages and it can be used to deploy applications. Also, it lets you set up a database for free which is a huge plus for me.
The resource that helped me the most was a video tutorial on YouTube. There are actually multiple tutorials if you search heroku clear database. Using that tutorial, I was able to set up a MySQL database. I was also introduced to MySQL workbench. This is a database design tool that lets you connect and work on MySQL databases. It has an easy to understand graphical interface and you can even run queries from it.
Now, I have a database. Cool … but how do I connect it to our application? We’re using Vue.js for the frontend and I wanted to set up a system for our backend. Learning a good way to do this was a bit of a struggle. This will be the topic of my next blog post. We’ll tackle the design or system I used to connect our MySQL based backend to our Vue.js frontend.
Thank you for visiting my blog. Today, I’m going to tackle some topics related to QR codes. As I mentioned in my prior post, I’m going to be focusing on the Capstone project for CS467. This is a final project for the online postbaccalaureate computer science program at Oregon State University.
Luckily, I have a great team for this project and the three of us have decided on an interesting application. I’m sure most of us have seen or used a time management system for work or school. Our team is planning on creating a time management system that uses QR codes to clock in and out. Imagine you’ve just arrived at your work location and need to clock-in. There would be multiple screens or even pages with QR codes all around you. You would just open up the camera on your phone, scan one of the QR codes, and be on your way. Now, you’re clocked in. When you’re leaving, you just have to scan the QR code related with clocking out.
We’re hoping this application can ease the clock-in and clock-out system for certain workplaces. However, what about remote work? It’s obviously important to consider as well. A company could place the QR code in the desktop of a work computer or even use a simple web page on their website. With how popular phones are and how often we use them, we’re hoping that this would be another helpful tool. For the next 9 to 10 weeks, we’ll be developing this application. Hopefully, I’ll be able to show our progress on this blog.
First things first … what are QR codes? It actually stands for quick response. I didn’t really know that, but great to know. You might have seen them before, but QR codes generally look like this:
Before we harness the power of QR codes, I thought it would be useful to learn about them. QR codes are a type of barcode that can be read by digital devices like phones. According to Kaspersky, QR codes store information as a series of pixels in a square-shaped grid. In 1994, QR codes were first developed by a Japanese company called Denso. This company was actually a subsidiary of Toyota. They used QR codes to track vehicles and parts. It was useful for them because these QR codes could be read in two directions (top to bottom and right to left). As a result, they could store a lot more information and be used to encode kanji characters as well. A QR code could also just contain the URL of a website.
Luckily for us, Denso Wave made QR codes publicly available and stated they wouldn’t claim any patent rights. Now, QR codes are used in the public in a whole variety of ways. Also, most cellphones now have built in QR code scanners as well. Some organizations use QR codes to link people to certain website pages or even menus. Apparently, some companies even help with putting QR codes on grave stones. A person could scan the QR code and be given a description of the deceased person’s life. In Ontario (Canada), everyone was given a QR code on their official Covid vaccine certificate as the code can be easily scanned to pull up vaccine records.
QR Code for menu
It’s important to recognize there could be some safety issues with QR codes. They can be used maliciously. You could have a QR code that links to a fake website where personal information can be collected. From my understanding, you should really only scan QR codes you trust.
Now that I have a better understanding of what QR codes are, I’m hoping to be able to use them for this Capstone project. The next questions are how do I make them and deliver them. As a team, we have decided to use a JavaScript based library by David Shimjs that will help us create these QR Codes. You can find this library at: https://github.com/davidshimjs/qrcodejs
These library is really easy to use and the ReadME.md is helpful. This library also has a MIT license when it comes to using it. Next week, we’ll be tackling Vue.js. It’s a framework similar to React. Specifically, it can be used to develop the front end of a website. I haven’t used it before, so I’ll be researching it as well.
Thank you for sticking with me on this journey. I hope some of this background on QR codes was interesting. I hope you have a great day.
Hello to you from across the screen. Sometimes I forget how amazing this world is. I’m not sure where you are, but right now, we are two people communicating across this large world. Two people out of 7.9 billion people. Well, it’s actually a bit one sided, but thank you for visiting this blog.
You’re probably wondering what this blog is going to be about. This blog will be about my journey into the software and coding world. It definitely isn’t a straight forward story as I had to switch careers. I also wanted to emphasize my experience with the online computer science post-baccalaureate program at Oregon State University. I’ll also talk about a course I’m taking right now as part of this program and the main project from it.
When writing a blog, it’s said you have to consider your tone and audience. For my tone, I’ve decided to go with how I am and try to be honest as possible. For my audience, you could possibly be a high school student, a college student, a working professional, a TA or professor that has to mark this for some reason. However, you’re more than welcome here and I hope that my writing doesn’t get too boring along the way.
Let’s start with my first experience with computers. This is somewhere in the early 2000s, but my dad had bought our first computer. The only thing I can remember about this computer is that the monitor was massive and weighed a ton. I remember taking it downstairs to throw out and how it took three of us. We’re talking about something like this:
Large monitor
Along the way, I got hooked to playing online browser games. We’re talking about sites like Armour games and MoFunZone. Then I got interested in online forums, modding games, and a browser game called Tribal Wars. I eventually met a family friend that was a software engineer. I remember watching him fix our old computer and I was amazed at how it worked. Time passed and then I took computer science in high school as I was interested in it. Then … I went to university where I majored in biology and psychology. That last part doesn’t really match up with the rest of this story.
However, I didn’t take a single course in computer science when I was doing my first bachelor degree. Looking back, there are some regrets. I really enjoyed learning about biology though and research was something I wanted to do at the time. Then came reality. Upon graduating, I learned my bachelor degree in biology wasn’t really worth anything. If I wanted to get into meaningful research, I was looking at another 6 to 8 years with low pay and it would still be challenging to get into academia. Disillusioned with this, I thought I could hit the work force. However, my degree wasn’t much better there. I didn’t have a lot of experience with labs and should have planned better for this. To put this into context, I’m from Canada. I graduated from our highest ranked university, but a bachelor degree isn’t really special when everyone has one. For some proof, Canada is the most educated country based on OECD criteria and data for 2018. So, I started my first job as a reservation agent for a large hotel chain in 2019. Getting that first job was difficult as well and nobody really prepares you for that.
I worked at this job for about a year while wondering if I should get a masters in public health. I decided against it and tried to find another job. My second job was as a claims advisor for property insurance at a large company. I worked there for 1.5 years. I always found it funny that I ended up in jobs with a lot of customer interactions while being an extreme introvert. Those jobs did help bring me out of my shell and I’m thankful for both experiences.
While working as a claims advisor, I came across a reddit post about an online program at Oregon State University. It was a post bachelor program where you would end up with a bachelor in computer science without having to take any general distribution requirements like humanity courses. As a result, this program could be completed within two years. It’s weird to think that my current career projection is based on a reddit post, but this program has a solid subreddit and it kind of makes sense now. I was really interested in transitioning to a computer science career. I’m going to be honest about why. I thought I was somewhat good at coding, that the work environment suited me better, and that this career could result in a good salary. I also loved problem solving and I hoped I wouldn’t have as much customer interaction.
Still, it was scary to do another bachelor program after how my first one went. It would cost me about $30,000 USD dollars or about $37,500 CAD dollars. I remember researching at the time and worrying if I should do it or not. If I could afford it or not? I remember wondering if I should do a boot camp instead. The reason I went with this program is because I wanted to have a solid foundation in computer science and I needed a structured program. I also thought that not having a degree could be a problem in the future. Another positive was that a lot of people seemed to have succeeded with this program as well. This program was also really flexible and I was able to do a couple of part time semesters while working full-time.
This program isn’t perfect by any measure. For CS 344 (operating systems), I thought I was going to fail at one point and that was that most challenging semester I’ve had due to a lot of issues. Overall, I think the program is solid though. You start with learning how to code with Python and some basic coding rules. Then you learn a bit about web development, databases, structures, and algorithms. You have a few group projects where you can develop products to put on a resume.
Now, I’m on my last semester as a full-time student. It looks like I will be completing this program in under two years. I’m doing really well in the program, but it’s financially tough. At the end of the day, I remind myself that I invested in myself and I hope it pays off. If you’re in the same position and are wondering if you should do this program, all I can recommend is researching as much as you can to see it fits for you. You can message or comment below if you have any questions for me.
This post has gotten really long. If you’re still here, thanks for reading all the way. I promise to try to have shorter posts for next time. For my next discussion, I’ll be talking about the capstone course for this program and the group project I’m working on.
