Category Archives: cs-wsu

Why Vue

There are several frontend frameworks available to pick from, so why do we use Vue? To research about Vue and learn about its benefits, I decided to read blogs from Vue mastery, specifically one written by Lauren Ramirez.

  • Vue does not use up too much memory. Vue allows us to import only the pieces of the library that we need, which means whatever we don’t use will be removed for us via treeshaking.
  • Virtual DOM (Document Object Model) uses compile-based optimization resulting in faster rendering times.
  • To work with Vue, we did not have to learn HTML, CSS, and JavaScript. It was surprisingly easy how we were able to learn as we go.
  • Vue has many libraries that can be added as needed. Some of which are:
    • Vue Router (client-side routing)
    • Vuex (state management)
    • Vue Test Utils (unit testing)
    • vue-devtools (debugging browser extension)
    • Vue CLI (for rapid project scaffolding and plugin management)
  • Vue’s one of the best features – Composition API;
    • We are able to group features into composition functions then call them in the setup instead of having large unreadable and unmaintained code directly in setup.
    • We are able to export features from components into the functions. This means we don’t have to keep re-writing code and avoid having useless repetition.
  • Vue has enhanced support for TypeScript users as well.
  • In Vue, we are able to use multi root components. In most front-end frameworks component template should contain exactly one root element because sibling elements aren’t allowed. The way around to that problem is using functional components, they are components where you have to pass no reactive data means component will not be watching for any data changes as well as not updating itself when something in parent component changes. However, they are instance less and you cannot refer to them anymore and everything is passed with context. With the multi root component support of Vue (Vue 3), there are no such restrictions and we can use any number of tags inside the template section.
  • Vue 3 gives us the Teleport component, which allows us to specify template HTML that we can send to another part of the DOM. Sometimes a piece of a component’s template belongs there logically, but it would be preferable to render it somewhere else. This is useful for things like modals, which may need to be placed outside of the body tag or outside the Vue app.
  • Most importantly, Vue is open source. Vue has complete freedom to be community-driven and its bottom line is the satisfaction of its end users. It doesn’t have to answer to the company-specific feature demands and corporate bureaucracy.

Source: https://www.vuemastery.com/blog/why-vue-is-the-best-framework-for-2021-and-beyond/

From the blog CS-WSU – Towards Tech by murtazan and used with permission of the author. All other rights reserved by the author.

Differences in RESTApi’s.

In class we have been working on a RESTApi, frontend/backend, that supports a Food Drive. So far, we have a database that stores Items with orders. These orders have an ID as well as the items. These orders have preferences, restrictions, and emails attached. We developed HTTP calls to manipulate this data in a Rest API. We developed ways for the admins in the backend to manipulate this data. And we developed ways for the users to interact with their orders and items within the frontend of the API.

I thought it would be interesting to take a look at RESTApis that are available through the internet that are individually made, professionally made, and company made. The number of APIs out there is extremely broad and vast. Which makes it very exciting. There is essentially an API for everything out there. From news, health, gaming, PayPal, etc. there is literally everything available to you to implement in your own web service app.

This website here is a database full of APIs that are available for you to use.

Link: https://rapidapi.com/hub

                This led me to a couple interesting ones. For example, a gaming API for Call of Duty: Modern Warfare. It’s neat. You can implement this API into your web service and users will be able to get access to multiple statistics throughout the game. Say you wanted to develop a gaming website. Where users build teams, go to a match finder, play other teams, and improve their placing on a website leaderboard. If Call of Duty is one of the games these users play against each other on, you could implement this API. And allow users to show off their in-game stats.

                Try bringing this site even further. Imagine giving each users an account that has an empty balance. If there is a way for them to add their own money into the balance, then you could create wagers on the match finder. The match would require a price to enter. If the players have the funds in their balance, it will allow them to play. You would need to implement someway for the users to add money into their accounts. That’s when you implement the PayPal API.

Paypal API Link: https://developer.paypal.com/docs/api-basics/

Since PayPal interacts with user’s banking and extremely confidential information, to work with a PayPal API, you need Developer access. When you create a sandbox or live REST API app, PayPal generates a set of OAuth 2.0 client ID and secret credentials for the sandbox or live environment. You must receive a access token to be authorized. To go live with a PayPal API, your application must get accepted by PayPal before having access to any accounts. They way the accomplish this is by giving you a Sandbox that acts as a life environment but isn’t connected to any accounts. Once all your testing and debugging is done, that’s when you apply to use it live.

From the blog CS-WSU – Andrew Sychtysz Software Developer by Andrew Sychtysz and used with permission of the author. All other rights reserved by the author.

Tips on easing the learning process of JavaScript

After a long 2 and a half years of learning to code, there are many challenges I have come across that halted my process. Here I am going to sum some of the issues I may have come across during my journey. And some tips I have found to be incredibly useful to change the tides and direction of how I learn.  

                First things first, understand your distractions. Why you are distracted, and how to make “learning to code” the distraction for you. What I mean is, picture how you use your social media. You may think “I am just going to check Facebook for a few minutes before I get to coding”. Next thing you know, you are on Facebook for three hours. Where did the time go? Somehow, someway you just got sucked into what you decided to put in front of yourself. What if, you decided instead “I am going to just code for 10 minutes then play around on Facebook.”. Next thing you know, you got sucked into coding for hours instead of spending all your time on social media. It will always be better to leave yourself no time to look at social media than having no time to practice coding.

This is how you should structure all your priorities. Don’t treat yourself first in hopes that this will give you the motivation to start getting your responsibilities out of the way. There is a limited time in every single day. We all know, the longer the day goes on, the more tired and slow you become. Utilize your energy correctly. You should be treating yourself when you are already burnt out. That way when all your energy is dispensed, you are relaxing readying yourself to recharge rather than forcing yourself to continue working when you are exhausted. This will help with sleep issues too. Using your brain at maximum capacity is going to ultimately make it harder for you to fall asleep. Utilize your time correctly during the day.

Now your coding, great job! Only problem is, you may find yourself being over-confident now. Just because you have solved something and moved along with almost no hiccups, doesn’t mean you have that solidified it in your knowledge. Learning something quickly is the worst thing that can happen. This sets you up to forget very quickly. The most memorable thing for a person is when they struggled hard, overcame their adversity, and accomplished their goal. You forget a cakewalk the minute it’s over. Limit the number of things you are learning at one time. And practice it in code. That way, you won’t forget. The key point is to make your work memorable for the next time it comes up.

I found this site, which is somewhat a journal. That gives tips on how to learn JavaScript Faster. It touches on a lot of the things I just described.

Link: https://www.sitepoint.com/mind-tricks-to-learn-javascript-faster/

From the blog CS-WSU – Andrew Sychtysz Software Developer by Andrew Sychtysz and used with permission of the author. All other rights reserved by the author.

Blog Post #6 – SQL VS NOSQL

After having listened to blogs and watched videos [1] on SQL VS NOSQL and having spent a number of years working as a SQL developer, my view is that this isn’t a battle. Each have their own uses in a given situation. There are times when you need a very strong, well organized, secure, database design, and this will usually fall to being a SQL database. This is usually, but not always done in a business or enterprise setting, but also works well on mobile and desktop friendly implementations.

NOSQL is really just a growth from other ways simple data formats have been carried around over the years. Starting with flat files, then to CSV (comma-separated values files), then to more formalized “strings” of data in the world of markup languages. This started with SQML/HTML, then to XML, then to JSON. These formats continue to evolve to worlds of XAML and others, but for our discussion, let’s use JSON.

It is easy to describe my lunch as “Name: Joe, Time: Noon, Food: Cheeseburger”.

There is no implied database in this text string. It clearly says my name is Joe and I eat burgers at noon. In SQL, there would be Students, Orders, Inventory tables, all with multiple links and schemas to describe the same line. ( The key/value pair Name/Joe is represented in JSON as Name: Joe,)

It is very important to determine what your requirements are before deciding on if or what technology to use for a given purpose.

There are times when writing and testing particularly sophisticated SQL stored procedures where I was frustrated with the complexity and rigidity of the data integrity requirements but was then rewarded with the benefits of the product. Very well encapsulated, easy to use once constructed, stable, secure, fault tolerant products were the goal.

On the other hand, it is easier to use JSON to describe simpler situations that don’t require the relational connection between components that SQL vertical databases do.

I think both the XAML and JSON markup formats are easier to read than XML or HTML. I am also a fan of CSV files when key/value pairing isn’t required.

The internet seems to have “wars” frequently on what is better A or B? This very frequently comes down to “Sometimes A, sometimes B”. This competition between ideas is the reason I am optimistic towards the future. Someone is always trying to reinvent a better way to do almost everything.

As a software developer, you are constantly learning, relearning, unlearning, reevaluating, and improving. This process is enjoyable to me, but I know some who hate their job because of this constant change. For me, the key when getting frustrated on a problem was in learning how to back away, take a walk, and come back with a fresh outlook.

References:

1. U.S. Financial services market

From the blog cs@worcester – (Twinstar Blogland) by Joe Barry and used with permission of the author. All other rights reserved by the author.

codegrepper.com

I used to believe that this was a pro in my coding abilities but the further I go, the more I realize that is actually a con. When I first started coding in CS140, I realized that I have had a unique ability when it came to paying attention to detail. When I am absolutely lost or confused, I will hammer the nail all day. Meaning, I will read every single character in every line of code before I decide that I am completely lost. This is great, time and time again I have proven that no code is a match for me. I always seemed to outwork my failure. Before the deadline passed, I had made sure that I submitted something that makes sense and works.

Once I started working on our latest Javascript homeworks, I realized that this is not helpful to me. I have managed to get my codes to work. And I have managed to get them to do what I needed them to do. That being said, if you asked me to explain the code in plain english I would struggle to do so. That’s because I just spent hours and hours playing around with the code. Instead of researching basics and creating a great fundamental understanding for myself, I just went for it. I believe life would be alot easier if I had this fundamental understanding before I began coding rather than trying to grasp it during coding.

Codegrepper.com is something I found while researching these fundamentals. It seems that I have came across a gold mine. This link right here specifically helped me work on the get method within my javascript for the HTTP Get request.

https://www.codegrepper.com/code-examples/javascript/javascript+find+object+in+array+by+property+value

Immediately you have a code snippet of javascript which finds object in array by property value. And it begins to build up. It shows you how to find object by property. How to find ID in an array javascript. And so on. This website also has a search engine that allows you to search anything. It seems to be an incredible tool, especially when learning new languages. If you type “hello world”, it gives you the intro code snippets for any language you can think of. I will definitely take more use of codegrepper.com moving forward.

From the blog CS-WSU – Andrew Sychtysz Software Developer by Andrew Sychtysz and used with permission of the author. All other rights reserved by the author.

API Development in the Field of Computer Science.

Dear Classmates,

Please consider making a LinkedIn as soon as possible. Take a look. The amount of job listings searching for someone with a B.S. in Computer Science is incredible, especially in regards to API development. An API developer can make a phenomenal salary. What we are doing currently in CS343 is so extremely important for our futures.

APIs go back to the early days of computing. Even before the personal computer. It was normally used as a library for operating systems. It was always local to the systems, although sometimes it did pass messages between mainframes. Eventually APIs left the local environment. And became a very important piece of technology for remote integration of data.

In class, we worked with 3 sets of codes so far. The Items API, Frontend, and Backend. These all work together to create our Application. The ItemsAPI is a specification. It creates our Items. The characteristics, fundamentals, and how the object is going to preform. It will allow both humans and computers to discover and understand the capabilities of the service without access to source code, documentation, or through network traffic inspection. When it is properly defined, a consumer can understand and interact with the remote service with a minimal amount of implementation logic. The Frontend/Backend model is a way of sharing or organizing an application’s workload. Every application has a frontend and a backend. The frontend is the part of the application that receives input from a client. The backend is the part of the application that processes information, such as processing a payment or looking up customer information. These often communicate with each other. For example, the frontend will allow users to interact by providing credit card information. And the backend will charge their cards for purchases. The frontend receives input. And the backend processes the information.

This will be so absolutely huge for us in our futures. Think about it. Almost every business at this point has a website. You could easily find yourselves making 50k, 90k, 120k, etc. managing these businesses Web service/Applications. As we saw with COVID, there was a massive push to doing almost everything through technology. I can assure you, there will be millions of businesses looking for people like us. And you will be such an important backbone to the business. They will have no choice to give you the Salary you deserve. Please consider making a LinkedIn as soon as possible. Also, do your best to live inside our applications Professor Wurst has supplied for us to work with. If we learn to be comfortable with this type of work, we will absolutely find success in our field.

Thank you and Good luck! 😀

From the blog CS-WSU – Andrew Sychtysz Software Developer by Andrew Sychtysz and used with permission of the author. All other rights reserved by the author.

DinD or DooD but not D&D

While surfing my usual waves at google I came across an article with some peculiar information. It does not directly relate to our current homework, which deals with the backend and API ties, but it is somewhat relevant. The article presents the argument of security in using DinD as a liability exposing the operating system to the container directly. Another important factor was the reliability of DinD and unintended consequences and conflicts with the use of it. I can’t think of possible bugs that docker in docker can cause, but I guess I can see how different operating systems with different file hierarchy and possibly arbitration can be a messy thing to untangle. Regardless, he shows a quite simple and cool way to have an important DinD capability without using DinD.

Why use docker in docker

while scouting for articles I came across this one https://jpetazzo.github.io/2015/09/03/do-not-use-docker-in-docker-for-ci/ by Jérôme Petazzoni, it is interesting and tells the story of how DinD  was actually created to help develop docker itself. The use of DinD, as it appears to me, is mostly based on the need to run multiple images within docker to achieve continuous integration. Being able to test the entire system and making sure that integrity is maintained is what makes DinD so useful, or does it?

Why not use docker in docker

The author of the article mentioned tells the many headaches of developing DinD, some of which involves convoluted solutions that worked partially. The more I work and learn from this class, the more I determine that, if something is really complicated and requires too many hacks, it us not worth pursuing. I believe this was the case for early DinD. Some of the problems encountered were different security modules and many others that I am not quite familiar with, and can’t really discuss intelligently about. But DinD moved on, and a lot of improvements were made to improve on a lot of the issues, although I believe issues remain, partially because the article’s author involved with the development of it, asks you to use something else.

Do this instead, DooD docker out of docker

Thankfully, the article’s author gives a solution to the problem, and I didn’t even have to go back to the original google wave I surfed earlier to retrieve it. He mentions DinD works in some kind of quasi object-oriented principle of inheritance, where the containers have a family like hierarchy, this may cause some disturbance in the force. The solution he shows act squashing that inheritance down to a sibling relation, no one depends on anyone, we are all in the same level. The solution works by volume mount, mapping the docker socket. This is the solution for the running DooD in a project that requires continuous integration, “docker run -v /var/run/docker.sock:/var/run/docker.sock  -ti docker”, there are probably advantages as well as disadvantages to doing this but ill leave that for you to decide.

From the blog CS@Worcester – technology blog by jeffersonbourguignoncoutinho and used with permission of the author. All other rights reserved by the author.

API

This week we talked a lot about APIs and to my surprise I thought APIs did much more than they actually do.  Another peculiarity is that the only sort of programmatic process they support are the ones provided by HTTP calls, which again is also something I never had to deal with outside of cluelessly browsing the web.  Nevertheless, they are very important and incredibly intricate in the form of versatility offered to a variety of operations.  This is all very new to me, and this blog may show not only useful things I’ve learned but also crude misconceptions I may have formed by mistake, in the ladder case please disregard or give me a heads up and I’ll make corrections.

HTTP calls are GET, HEAD, POST, PUT, DELETE, CONNECT, OPTIONS, TRACE and PATCH my knowledge in the subject prevents me from saying that this is all of it or if there are more, use this site to refer to them https://developer.mozilla.org/en-US/docs/Web/HTTP/Methods it has comprehensive descriptions.  From the most recent assignment we had we utilized GET, POST, PUT, and DELETE.  I would like to summarize their function for my own benefit.

  • The GET request is used to retrieve data from the server, and it can only receive it may never change the data in the server
  • The PUT method is used to send and change or create data in the server it is different from post because it is idempotent, (big word) please refer to the URL https://www.w3.org/Protocols/rfc2616/rfc2616-sec9.html#sec9.1.2
  • The POST method is similar to PUT but it is not idempotent, I think the simpler way to put it, oh sorry, post it is that POST creates a new instance every time it is used and PUT would replace it, this article shows good old English we can understand explanation about it https://reqbin.com/Article/HttpPost.
  • The DELETE request will do as it says, it deletes the requested data from the server and unlike GET and HEAD, which we are not mentioning, it may change the state of the server.  A cool thing I get from it is that some servers may reject a DELETE request which makes sense, deleting data should be a restricted action.

Something else I’ve learned from this assignment has to do with the YAML file which I looked up in order to know where it comes from and what it stands for.  There are other things I wanted to talk about related to APIs, but too many to fit here, so I’ll end with YAML.  YAML is a superset of JSON which is a java like way of representing and structuring data.  YAML can do anything JSON does and some more.  JSON is formatted using braces and brackets while YAML uses colon and two space indentation.  In my opinion I think conventions like this such as in python makes for messy nesting which leads to code hard to visualize.  YAML is like JSON, language-independent making it a good tool to use.  https://circleci.com/blog/what-is-yaml-a-beginner-s-guide/   

From the blog CS@Worcester – technology blog by jeffersonbourguignoncoutinho and used with permission of the author. All other rights reserved by the author.

Docker Docs Tutorial Follow-up

Hi everyone, or one, however many, hope all is well. These last few weeks have been hard for all of us, and it is tuff to keep a captain’s log when the sea is turbulent and requires careful navigation. This is the reason I decided to try something new, something I suppose I should have been doing all along. Instead of studying the subject and writing the experience, I will try to combine writing, while, getting acquainted with the subject. Disclaimer, this is a test, it is a discussion from following the tutorial not instructions. Feel free to follow the tutorial –the link is at the end.

The beginning of this tutorial has us creating a folder in cmd and opening that folder, I tried to follow it to the letter.  Windows users tend to get lazy with all the easy click visual aids and underestimate the power of the shell (pun intended).  While playing through a python file, I decided to write the script on the shell and forgot to use “”.  Many lines later I realize the time I wasted with the useless typing effort. Echo “import time” > app.py was all that I needed, sometimes we go through the extra effort without realizing there is no extra reward. The focus of this tutorial is not the python script [ctrl c, ctrl v is my best friend/enemy].

The second part of the tutorial has us setting up a Dockerfile. I wasted some time trying to find the [.extension] for Dockerfile, which shows how sometimes is easy to go around chasing our tails in tutorials. The tutorial has a very good set of explanations on what every line is doing. I really like the RUN pip install -r requirements.txt, which saves space and compartmentalize things, all we must do is write the txt for the requirements in that one file and we never have to touch the Dockerfile for petty things such as these.

Step 3 has us creating a [.yml] file for the compose json like statements. As mentioned in the tutorial this compose file defines a [web] and [redis] services, I assume the version is not linked to anything or it is set at the developer’s discretion giving the condition of some actual project. The [web] service just points to the port that have been exposed from the Dockerfile, I suppose. The other service [redis] is an image to run parallel to the image already running from Dockerfile.

The final step was to just run [docker-compose up] and I must say there is nothing more pleasing than blue text and no errors at the end. It then asks you to use the keyword [volumes] in the [.yml] file to bind the current directory on the host to /code, I must say I got an error for missing a space on [-.:/code] instead of [- .:/code], see the difference.  We’ve done this in class, but any good guitar player could tell you –repetition is the name of the game.

https://docs.docker.com/compose/gettingstarted/

From the blog CS@Worcester – technology blog by jeffersonbourguignoncoutinho and used with permission of the author. All other rights reserved by the author.

Blog Discovery

Why do we use Docker?

I decided to choose this article because it goes in-depth on the way we use docker in real life and how efficient it can be when it comes to “virtualization” in a sense, which allows it to run smoother. Plus, BMC blogs are filled with potential reads about software development, implementation, methods, etc. filled with blogs about other project they have accomplished to supply on  how we are already learning the basics on docker and command lines, this information on how docker works will be used in my class for future projects will give not just give me insights but other students that have a need to gather an understanding on how to operate docker and its components and valuable resources.

What is Docker exactly?

Docker is an open-sourced platform that is Linux based towards virtualization but using containers to build, run, test and packages applications with pure efficiency without losing its integrity because it doesn’t rely on the computer’s hardware but on the OS (Docker Engine). Docker is broken down into different elements that helps it run a bit smoother than virtualization, which are containers, images, registries, docker file, and Docker engine. Docker image are set instructions that make up the containers and processes on how to run the application. To run the images, we have the docker engine that helps maintain the virtualization said container on the host machine. If docker is installed it can be applied the same when it comes to container since they run the same. For example, when we want to build a website and add in a web server along with a database such as MySQL, we can simply make an image for the MySQL and give it instruction to the specific port you wish. then package the web server in a container to run the images you already preconfigured and its dependencies, so if you need more servers to be added, easily deployable and easy to migrate said containers to new server. 

I have no prior experience with docker but have a great understanding on how it can be useful in software development and how it can used efficiently especially when compared to cost and using VMs. I could have used this practice in combine with my database class of when I built a MySQL sever and could’ve practice my database with a docker container and saw first handedly how to implement and observe the inner workings of composing it into a container to save the hassle if I wanted to build a web server or application entirely on the docker services. 

Blog resource link: https://www.bmc.com/blogs/docker-101-introduction/

From the blog cs@worcester – Dahwal Dev by Dahwal Charles and used with permission of the author. All other rights reserved by the author.