Skip to main content

Posts

Showing posts with the label Javascript

Book: The Bootcamper's Guide to Web Accessibility by Lindsey Kopacz

As a human being in the 21st century, I realize how important it is to make sure my websites are accessible to everyone. I make webpages, and I know they can stand to be improved on the accessibility front. I know about alt text in images — and will use them more in the future. I need to integrate them more into my development flow — it’s 2021. There’s no excuse. And that is only the tip of the iceberg. I was generously gifted this book by marktechson on Twitter - Thank you 👋🏾! I revisited the book several times - It's a lot of information I'm not familiar with, and wouldn't feel okay with recapping, especially as you can buy the book over here .

A Complete Beginner's Guide to React by Ali Spittel

 Why not learn a bit about React? Video here .  Tech used: React Hooks Node.js Programming fundamentals (HTML, CSS, Javascript)   Github repo .  I added the nifty drop down menu. I learned about it on Twitter about 3 days ago.

Making a Tourism Slideshow With HTML/CSS/JS (Ft. TraversyMedia)

 Video for reference here . I'm one to encourage good rest over constant work.  Yet I found myself awake at 2 AM listening to this video by TraversyMedia, because I was suddenly curious about making a full page image carousel. I wanted to listen before I put hand to keyboard in coding, so at around 3 AM, I pulled up my machine with an idea.   I followed the instructions and did most of the code myself. Here, I outline: The changes in my code from the original. The demo mockup ( Here ) The changes in the new Tourism: Welcome to Babylos! . The images may take a moment to load at first. The original video code says .buttons button#next .buttons button#prev But the code didn't work! The buttons were still as follows:

Shadow Text & The Gradient Wave(Javascript 30 Redo)

The original project has a plain white background, one emoji, and one word of text. I added a gradient background. Psst. I have that.

Clock Un-Stoppers (JavaScript 30 Redo)

Earlier this year, I did the JavaScript30 course by Wes Bos. I decided to try it again despite completing it (mostly) because it was fun. Day 2 stumped me with the clock. I had revisited it in my nightmares and in the physical realm, still mystified as to why my hands weren't moving. Tonight, I started with this one straight on, with 90% success. New GitHub -> Here . Why does it work now? Here's a sample of both codes;

Fullscreen Video Background Mockup

This is a mockup for a metro system. Clearly fake, because why would the United States have a decent metro system when people could make money? GitHub ⏭ Here Notes : I couldn't quite get the text to be in the middle of the page. Probably some padding issue. Here is the video used in the background of the page There's a tool in Visual Basic called Emmet, where we can type the first few letters of a bit of code, hit tab, and it fills in. No more typing all of !DOCTYPE HTML.

Star Ratings with Javascript and Font Awesome

Minus a sizable hitch, this was pretty fun. My Github Code => HERE NOTES:

Javascript 30 notes for Day 15 ,17, and 20

Day 15 => Local Storage => GitHub Well, all the data will eventually be in an array. And that array data will be turned into a big string. Every time we add an item we run that populateList function. But it recreates the entire list, so be mindful of that. ID = For Ternary operator because any indication of the word checked will automatically check hte object in the list. LocalStorage is in the browser, stored in the domain. It’s a key value until further configured, and the only option is strings Day 17 => Article Replacement => GitHub Featuring bands of my own design. The replace() can take away articles for easier sorting. I wonder if there’s an option to take away vowels in words. Many ways to make this thing; return strip(a) > strip(b) ? 1 : -1 If all you’re doing in a function is returning something, you can use an implicit return; const sortBands = bands.sort((a, b) =>  strip(a) > strip(b) ? 1 : -1); (remove return and the } b...

JavaScript 30 notes for day 10, 12, and 14

——— Day 10: Press Shift to Pay Respects ==> Github All boxes checked between the first and last box you’ve checked, nice. listen for checkbox activity (input type - checkbox) eventlistener for a click (or keyboard ‘click’) put the first check into a variable. (as let, it’s reassigned constantly) see if shift key is down. and if key is down and box is checked, have a blast, do what you want. “Is the checkbox equal to the one being checked”? ——— Day 12 Code-Nami Press ===> GitHub

JavaScript 30 Notes for day 6,8

I have notes for days 3 - 5, and 7, but they're too short to make a good post with. This is from Day 8!

Javascript 30 Notes for Day 1, 2.

I'm actually on Day 6, but I like to have a good buffer to go over notes and make sure everything is uploaded to GitHub properly when completed. This is Wes Bos' JavaScript 30 , sent to me by a good friend, and I'm going to be doing this every day for a month. Then, probably doing them again. Day 1, we made a soundboard; GitHub files. Day 2, It's a clock...but no files.

Javascript Resources [02/14/2021 Update]

Happy New Year! I'm learning JavaScript and want to share some resources. Most of these are about understanding vanilla JavaScript, like this Javascript30 course I'm working through. I'm using Visual Studio Code for Mac to compile my codes. FreeCodeCamp has many resources in video, which is what I prefer: This particular one is more of a working model, using JSON to store values from webpages. Here is one that really starts you from the beginning. Still working through this one. CodeAcademy is possibly the best I have come across so far. The JavaScript course is available freely too, though you don't get the real world projects (I've done them, they're pretty easy). This Udemy's JavaScript Essentials works more with snippets in the console of Chrome. Of course, you can always pop around on GitHub, StackOverflow and read some questions. And Twitter is a good place too - Check out Javascript Digest . I like the SoloLearn course for Python a...

Packages With JSON

Default name is name of folder you’re in (Node) - enter Version # Description: What is the project about? It’s a tutorial, so let’s name it such. GitHub link.

Javascript and Servers

A bigger step from My Phone, The File Server. GitHub link  - Open Servfile.js Out of habit, I typed https in the opening const areas in several places. It doesn’t seem to have had ill effects, though you can see that the connection is not secure;

Welcome to Javascript

Node.js is an open source environment for Javascript. And now that I've concluded the basics with Python, let's keep the ball rolling. I find that, even though Javascript looks a lot more complicated, I gel with it a bit easier, and I'm not sure why. This is around the first 35 minutes of this tutorial here . I'm going to work through this and find some other resources. I've already found said resources and they look a little different in the code department than this, but it's mostly the same. We make three things here; Introduce ourselves Make a small game Establish classes and events