Read this post with code syntax highlighting on Coffeeclass.io.
The Problem
Recently, I was building a Flutter app and I needed to map over an array of users when a user logged in and check if their username, password, and security question answer matched what was in the database (the userArray). I tried to do something like this:
var userArray = ['User 1', 'User 2', 'User 3'];
userArray
.map((user) => {
if (user == 'User 1')
{
// log user in
} else {
// don't log user in
}
});Quick note: I removed some of my project specific logic and…
Read this post with code syntax highlighting on Coffeeclass.io.
Introduction
If you are familiar with Bootstrap, you know how easy it is to create a responsive nav-bar. In Chakra-UI, there is no built in, out of the box solution. In this post, we will create a responsive nav-bar component that you can use in your React app.
Feel free to check out my video version of this article.
The Idea
We will create 2 nav bars and use useState to dynamically change the css display property to hide and show the nav bar on desktop and mobile.
Setup
As a computer science student, I am always looking for another cool side project to keep me busy. These ideas for side projects can come from anywhere; sometimes from the places you least expect.
The other day I was scrolling through TikTok when I can across this video. Basically, it’s about how there are people in this world born on the same day and were in the same hospital are you were. Neat, right? I then looked at the comments and multiple users were saying there should be a website for this. Immediately I knew what I had to do…
Read this story with code syntax highlighting on Coffeeclass.io.
Whenever I work with Firebase, I always seem to run into small issues that can be very annoying (yet simple) to solve. When I tried to connect my Flutter application to a Firebase backend for one of my personal projects, I ran into some small issues that set me back some time. Because of this, I decided to write a simple and straightforward article showing you how to connect your Flutter application to a firebase backend for both IOS and Android. …
Introduction
A few weeks ago I wrote an article detailing how you can quickly create a cross platform mobile app with React Native and run it on your device. If you haven’t read that article you can do so here…
Since that article got a lot of traction, I have decided to write a similar article with Flutter!
Rather watch a video than read? Watch this article in video format on YouTube:
What Is Flutter?
Flutter, built by Google, is a UI toolkit for building beautiful, natively compiled applications for mobile, web, and desktop. Flutter apps are built using the dart programming language.
Introduction
Recently I make two YouTube videos detailing how to use Python and Selenium to code an Instagram Bot. Today, I am taking those videos and putting them into article format so you can follow along and copy/paste code! Just like the videos, I will be splitting these articles into 2 parts. You can watch the first video here:
Remember, this is for educational purposes only. I do not recommend using this outside testing and exploring purposes because Instagram does not allow bots!
Prerequisites
The following are items you need installed before you begin.
Python
- Navigate to https://www.python.org/downloads/ …
Introduction
This is a follow up post to the post I wrote just the other day on scrambling a Rubik’s Cube with JavaScript. If you haven’t read that post yet be sure to check it out here and then come back to this post. In this post, I will improve the JavaScript scrambler. To do that, we will unfortunately have to rewrite most of the code, but the fundamental design stays the same. Let’s get to it!
What’s a Scramble
You should already know what a Rubik’s cube scramble is (assuming you read the first post), however, here is a quick refresher just in…
Introduction
React Native is a JavaScript framework for building cross platform mobile apps. In this tutorial, I’ll show you how to quickly set up a React Native project and run your app on your actual device! The code for this tutorial can be found on my GitHub.
Expo
In this tutorial, we will be using expo with React Native. Expo acts as a container around the React Native framework that allows us to develop applications more quickly and easily compared to if we were using bare bones React Native. The first thing we need to do is install the Expo CLI command…
Introduction
The Rubiks cube is a popular puzzle in which the goal is to solve a 3x3 cube by matching the colors on each side. In order to solve the cube, you first need to scramble it. There are rules for how to do this but in general a scramble consists of 20 random moves performed in sequence. In this post, I will show you how to implement a scramble in JavaScript. The code for this tutorial can be found on my GitHub.
Scramble
A scramble is a sequence of 20 moves that are performed on a solved cube. …
