DEV Community: Jared Rice

2 Ways to use Git Without the Command Line

Jared Rice — Tue, 23 Mar 2021 20:08:07 +0000

In this blog I will be going over two ways to use Git without having to use the command line. The command line can be confusing for people who are just learning how to code, and haven't had much experience with working on projects. Through the use of the GitHub website and desktop client I will show you two simple ways to commit changes to a project without having to learn anything about the command line.

What is Git?

Before I start going over how to use Git without the command line I should introduce it to those who don't know what I'm talking about. Git is a tool that allows for people to collaborate on a project remotely, by using its various commands such as,

Commit
Fork
Pull
Push
Clone
Branch
Tag

These are the most common commands that if you every interact with git, you will be using. The main command that I will be going over today is the commit command.

What is Commit?

Commit is a Git command that marks a point in time for the code, and usually submitted with a message indicating the changes. This is usually done after a push command was submitted to the repository. Commits are comprised of 6 components,

Who did the changes
Time stamp of the commit
Commit message explaining them
Files changed
Line added in each file
Line removed in each file

Now that commits have been explained lets go on with how to interact with repos online.

Commit with GitHub Website

Using commit is very easy with the GitHub Website. Through the website you can edit most document with its basic text editor that is built into the site. I have built a simple repo to help visualize this example. I will be using this repo for the other example as well.

To edit any of the documents all you have to to is click on the file in the menu. For this example I will be editing the README.md file.

Once the file has been clicked on it will bring you to the file details section where you can edit, delete and do just about anything GitHub will allow.

To edit the contents of the file all you have to do is click on the pencil icon next to the open this file on GitHub Desktop button. Once you click on the file it will bring you to the text editor.

From here you'll be able to edit the name and contents of the document. Once you made the changes that you want, scroll down to the bottom of the page, and you will see a section with a commit button and a comment section to document the changes you made.

Commit with GitHub Desktop Application

The GitHub Desktop does not have a text editor. So to edit a file like the README.md file we will need to use an external program. I just used the Windows default notepad program. When you access the repository you'll clone it and make a local folder with the repo in it.

When you open the file in whatever editor you choose, make the changes and save the file. Once the changes have been made The GitHub application will show what file has been changed. It will look like this,

Once you choose the file, on the bottom left you can add a description to the commit. Once you have your desired commit message, hit the commit to main button. That will commit the changes to the project.

And there you have it! Two ways of using Git without the command line. Git is a useful tool for writing code online with a group of people. It allows for easy collaboration between teammates, and makes the online coding process much easier. I hope this has been helpful. Also check out the Youtube video I made on this topic. Have a great day!

https://youtu.be/8pIm7zAWZZc

Web.dev and WAVE Audit on Twitter

Jared Rice — Mon, 15 Feb 2021 00:15:46 +0000

Accessibility for websites is very important for the traffic and health of a website. There is a really cool tool that one can use to see the statistics of a website's accessibility, seo, and best practices. I used web.dev to audit Twitter's homepage to look at these statistics.

What I found

When I ran the web.dev tool I got these statistics
Performance: 68
Accessibility: 83
Best Practices: 86
SEO: 85
These numbers are scaled on 1-100, where 100 is the best score possible. The scores are generally very good, but performance is the clear odd one out. Thankfully web.dev provides you with the information as to why the score is so low. The main reasons why the performance is so low are:

Remove unused JavaScript
Avoid multiple page redirects
[role]s do not have all required [aria-*] attributes

The last issue on the list is related to accessibility, but these are the top 3 high impact audit items, so it just goes to show how impactful the first two are on performance. But the biggest impact of the first two items was the unused JavaScript. The web.dev tool allows you to look more in-depth with these audits, and the unused JavaScript was the biggest culprit on bringing the score down.

WAVE Audit

Next I performed a WAVE audit on the twitter homepage. This audit is used through the WAVE google chrome extension, and its free to download. This shows the accessibility of a website, and gives an in depth look into its UI. This will show what is most efficient and what is creating errors. Check out my video below for more information on it. I hope this was helpful!

Video: https://www.youtube.com/watch?v=8pmSTp7aSkg&feature=youtu.be&ab_channel=JaredRice

React vs. LitElement, Which is Better?

Jared Rice — Wed, 10 Feb 2021 19:30:29 +0000

What is React and LitElement?

First before we look into which is better we have to define both of these, first up is React. React is a JavaScript framework that is used for building UIs. It uses a wide range of components that allow for very complex interfaces to be made with relative ease. These components can be customized and reshaped to fit your needs through the use of properties. This gets you some pretty good customization.

LitElement is a library that allows for the user to import from an already established library. The customization with LitElements is a bit not as wide as React's but it is just as useful. As a library the user has access to many already great objects that they can use for their components. This means that if you have a specifi task that you have in mind, then LItElements will most likely have a component for it.

What is the Difference? How are they Similar?

React and LitElement are different but have some similarities. The biggest difference is that React is a framework, and LitElement is a library. Essentially it boils down to the flow of the application. With a library, the user is in control of the flow of the application, but with a framework, the framework is in control over the flow. This picture should help visualize this

When using React the user will have to extend a component to make use of it, such as a with the Tic Tac Toe example that can be found at, https://reactjs.org/tutorial/tutorial.html#before-we-start-the-tutorial. This is a great place to get started with React as well.

The React component gets extended and is subsequently used by the shopping list class. The same goes for LitElements. They both extend for their components to be used.

This example can be found at, https://lit-element.polymer-project.org/try. This is a good starting point to learn the basics of LitElement.

Which one is better?

I personally believe that neither is better than the other. They are both good at their respective roles, and it all depends on what the user thinks is a better fit for their project. They both can do generally the same thing, but they go about doing so differently. If you are interested in either of these please go check the out. I hope this has been helpful.

Also check out my video on this subject
https://youtu.be/Lq8tq1ynSE8

Introduction

Jared Rice — Mon, 25 Jan 2021 00:35:56 +0000

Hello, I am Jared Rice. I am a senior at Penn State University studying Information Sciences and Technology. I grew up in a small town in Northeastern Pennsylvania. I've always enjoyed working with computers since I was little. I enjoy almost all aspect of IT. I didn't really know what I wanted to do until my Junior year in high school when I took an A++ computer tech course, and finally realized my passion. I have greatly enjoyed my last four years at Penn State.I really am going to miss being here, but I am even more excited to see what the future holds for me and my career.

During my time spent at Penn State I built a Java application that took in user input and gave them suggestions on local State College restaurants based on that input. It was very simple but taught me a lot about coding and project management. I learned a lot about Java and NetBeans, the IDE I used to develop the application.

For almost two years I have been working for Penn State Arts and Architecture IT as a support specialist intern. I have many responsibilities such as printer maintenance, computer maintenance, computer life cycle management, etc. I have gained a lot of problem solving experience.

For this blog I would ideally like to learn new skills and share them with anyone who wants to take part. I am always willing to learn new things and hopefully you can learn something by reading or watching my videos. My first video is here and it goes over making a basic java project in NetBeans. Go check it out!: https://youtu.be/yNOOa6nvRRw

I am very excited for what the future holds!