Photo by Lena Balk on Unsplash

Background

I recently implemented the frost glass effect and a tilt animation on my website. If you are interested in implementing the glassmporphism, check out my last post: styling on frost glass effect. If you want to see the final live implementation, check out my website (arturocreates.com). In this article, I will walk you through how to implement tilt animation, and how to handle the mobile view as well.

JavaScript Implementation

Here are the steps to get this done.

<script type=”text/javascript” src=”./src/js/vanilla-tilt.js”></script>

3. Give your HTML container a…


Photo by Muhannad Ajjan on Unsplash

Background

Glass morphism is a UI design trend that creates a Frosted Glass aesthetic. It’s been used in Mac and Windows OS, and web and mobile designers have also picked it up. I really like this trend, and when I was first saw it I thought it would be somewhat complicated. But after some research, I found it to be rather simple. After watching a YouTube video, I implemented this design on my website.


Photo by Cytonn Photography on Unsplash

These three resources helped me go from beginner, to confidently take on clients as a web developer.

Zero to Mastery

The Zero to Master Web Developer course teaches you the fundamentals of web development as well as skills that can help you land a job as a developer. I know their platform and community has grown since I first took the course, so things might be a little different now. I learned HTML, CSS, JavaScript, React, Express, and Node, and I would expect…


Software Design
Software Design
Photo by UX Store on Unsplash

If you are working on CSS and want to be able to handle hover on desktop view, but wan’t to avoid any changes on mobile touch, I got you.

I spent too much time trying to figure this out, so I am writing a quick article for anyone who wants to implement this.

Background

In CSS, you can define :hover, which will trigger any styling changes when the user hovers the mouse on the item which you have tagged.

Problem

The problem for me was that it was also registering a hover when a user would touch the component on their phone…


Photo by Joshua Reddekopp

Who This Article is For

If you’re ready to code your first website, this post is for you. In this post, I will focus on HTML, CSS, and JavaScript. I’ll also touch on API’s and Databases. I will talk about what they are used for and go into Static vs Dynamic sites. I will also highlight good resources to learn with (both free and paid options).

What This Article Isn’t

I will not go into coding an example or project. To get experience, it’s best to practice the ideas and concepts covered. …


Image from UnSplash

Who This Article is For

Are you a small business who wants to launch their website and doesn’t have the budget to hire a designer? Maybe you’re an individual who wants to create a website for your personal brand, but doesn’t know how to code.

I wrote this article to help anyone who might not have web design experience, but wants to launch their own website.

There are many applications out there that help you create a website without any coding experience. Wix and Squarespace are among the most popular choices for people.

What This Article Isn’t

I will not be comparing Wix vs Squarespace. If you are interested…


On June 2019, I graduated with a Computer Science degree from UC Santa Cruz. I didn’t have a job lined up, so I went back home and started applying. I wouldn’t consider my path to be traditional one, but I did learn somethings along the way that I’d like to share.

Working while job hunting

Within a couple weeks after graduation, I started working in construction. Before my first day on the job, my boss knew that I was a recent grad and was looking for a job in tech. …

Arturo Lopez

Tech analyst at Accenture. Mobile app and web developer. Passionate about tech and education.

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store