DEV Community: robborys

hw-13

robborys — Mon, 10 Apr 2023 02:04:46 +0000

AARON'S ARTICLE HERE -> https://dev.to/aaronlobitana/ist-256-project-2-done-5d1g

How many elements did you end up going with? Why did you break it up that way?

We had a total of 4 elements, each serving a different purpose around the cards. The badge-template element was the smallest in terms of the scope, this contained the badge cards themselves. Each badge card had unique properties like title, creator, icon, category etc. Then there is the search-bar element. This element is used to store a variable that contains the user input, which is parsed through the search bar and stored. Then there is the badge-list element, which is used to store an array of type badge-template (or cards as previously mentioned). This array is responsible for storing and filtering the different badges based on what was input via the search bar element. Finally, we have a badge-search element. This element is used to glue all of the above elements into one solid page.

What was the hardest aspect of this?

The hardest aspect was most definitely being able to envision the way that the different elements were to interact with one another. It feels easier to look at a certain idea and recreate it than it is to map out exactly how the idea will function. Additionally, it was challenging to envision how the different elements were to encapsulate one another, and where to begin (or what the most basic steps were vs. the higher up steps are).

What part of this project was easier than you expected?

I think that the icons were easier than expected, initially the idea of importing objects via the internet / a link with a library stored was a bit intimidating. However, using the professor's code helped me envision the different ways that the non .js files interact with the project as a whole.

Homework 11

robborys — Mon, 27 Mar 2023 00:41:14 +0000

My assignment is to create the web component "badge-card" for our project.

How did you start?

I started by creating a drawing and mapping out the parts of the card, I then decided on what type each part of the card should be.

What did you decide to attack first?

I decided to attack the front end and visual aesthetic of the card, and have been working on making everything compatible with different length titles and different categories of courses.

What issues have you had?

Placing divs side by side was a little tough at first but I got it figured out. I had to restart the card recently after discovering that we have to use an Icon and not an Image type for the logo on the side, I am trying to figure out how to utilize an icon library.

What concepts translated from Project 1's card?

Many concepts have been applicable, the idea of creating a reusable web component, slots, using user input, and the card layout in general.

What's your next priority?

After figuring out icon libraries, I'd like to figure out how to make a different background color for different categories of courses.

What problems are you unsure of how to solve?

I'm quite confident that I will be able to figure out the overall task, I am just unsure of how icon libraries work at the moment.

From the point of a new developer...

robborys — Mon, 27 Feb 2023 00:09:36 +0000

What is confusing about platforms?

What exactly they are / what exactly their purposes and differences are. It is kind of expected that you understand exactly what they are and why you should use them without any prior context. It's confusing overall because as someone who only has prior experience coding local applications in Java, I have never thought about these kinds of problems before. I would like to know more about why a dev uses what they do, or why their company uses and how they choose.

How could web components and VanillaJS standards be taught in a way that is more approachable?

It seems like it would be a much better idea to learn the basics and more traditional ways of web development first. I think that getting dropped into the world of HTML CSS and JS right away and then immediately being exposed to Vue React and Svelte just makes things unnecessarily confusing. After being exposed to so much at once, I haven't had time to be able to specialize in any particular one or really pick up some skill. Instead I will immediately default to doing whatever I did last becuase that's most likely what I understand the most at the moment. I think that if the most simple basics of HTML were taught to me first and I grew comfortorable with that, I would be more resistant to overcomplicating things with JS. I also think that I would care more about what platform or components I use because I could envision what my project needs that I cannot complete myself.

What did you find easiest to work with on 1st stab?

I thought web components were easier, I don't have an exact reason as to why, I think I was just exposed to a lot of possibilities in a short amount of time so I just ended up doing more research and dedicated more time to understanding web components over other things.

Think back on the tooling. What parts were confusing? What clicked with you immediately?

I thought that the entire process was confusing. No particular part clicked immediately. (not quite sure if this particularly relates to tooling) I think that using open-wc framework clicked the most. I think that using the terminal always makes things seem more obvoius as you are forced to look at everything in a very plain way. Understanding what exactly npm is was definitely a confusing part.

**

What additional readings did you have to do in order to make sense of things?**

looked up what SPA frameworks are
Detailed explanation of web components
Detailed explanation of frameworks
Looked up differences and advantages of using web components
Looked up what frameworks vs what JS Libraries are
Looked into more detail about what Vue is
What is tooling?