level 6
$864.00 // August 3, 2020
CodeWars Challenge ($3.00 EXP): Sum of parts
Aspiring Web Developer
CodeWars Challenge ($3.00 EXP): Sum of parts
CodeWars Challenge ($3.00 EXP): Simple sum of pairs
Consuming ($1.00 EXP): Warrior Trading Starter
Use math to find digits in number. It runs much faster than other solutions that uses string and for sloops!
Consuming ($1.00 EXP): Warrior Trading Starter
Consuming ($1.00 EXP): Warrior Trading Starter
Creating ($1.00 EXP): Impriving gencats search with Google Trends API
Consuming ($1.00): Warrior Trading Starter
Need to grab Google keyword search trends and apply that to that to Bing search...
Learning interest:
Creating ($4.00 EXP): Udemy burger builder app
Learning interest:
CodeWars Challenge ($2.00): Black Fridays
Learning interest:
Creating x 2hrs ($2.00): refactor code to break up statem manage in different components.
Take out button enablement state out of BurgerBuilder and into SelectionControls. The process is more compliated than I anticipated and took me longer time to figure out.
Learning interest:
CodeWars Challenge ($2.00): Array Element Parity
Learning interest:
I think the idea is to still continue to become a JAM freelancer? or just a JAM developer for my own entertainment.
CodeWars Challenge ($3.00): Casino Chips
Learning interest:
Creating x 9 hours ($9.00): Building Burger Builder App
View Burger Builder AppLearning interest:
Creating x 4 hours ($4.00): Redesign Burger Builder App
I did two different design options. I think I will go with option 2 just because it may work better in reponsive view for the ingredients.
Well, after viewing the mockup in the browser, I think option 1 would be better.
Learning interest:
CodeWars Challenge ($2.00): Max diff
Learning interest:
CodeWars Challenge ($2.00): Remove duplicates
Learning interest:
Creating - struggling with CodeWars Challenge x 1hr ($1.00)
CodeWars Challenge ($5.00): Sum of a sequence, words to hex
Learning interest:
Consuming Udemy React The Complete Guide ($1.00)
Creating Udemy React The Complete Guide x 3hr ($3.00)
Learning interest:
background: url(...filelocation.svg)
Consuming Udemy React The Complete Guide ($1.00)
Learning interest:
CodeWars Challenge ($9.00): Find Outlier, Meeting attendance, Euqual sides of Array
CodeWars Challenge ($2.00): Multiples of n
Learning interest:
Consuming Udemy React The Complete Guide ($1.00)
Learning interest:
Consuming Udemy React The Complete Guide ($1.00)
Learning interest:
const Button = styled.button`//your CSS here`;
Consuming Udemy React The Complete Guide ($1.00)
Learning interest:
Creating Udemy React The Complete Guide x 2hr ($2.00)
Learning interest:
state
to manage scenes, instead of storing values like a libraryfindIndex()
to find matching values within an arrayConsuming Udemy React The Complete Guide ($2.00)
Creating Udemy React The Complete Guide x 2hr ($2.00)
Learning interest:
Consuming Udemy React The Complete Guide ($1.00)
Learning interest:
prop
.children
to render all elements within props
CodeWars Challenge ($3.00): Format String Names
Learning interest:
reduce()
method.CodeWars Challenge ($2.00): Bus Timer
Learning interest:
Creating x 1hr ($1.00): Update gencats
Add random quote and random keyword search functions to gencats
Learning interest:
this.state
for most instances. (You can still use state in React if you prefer)Creating x 1hr ($1.00): Update gencats
Cleaned up the code for gencats and refine the design.
Learning interest:
CodeWars Challenge ($3.00): No order of operations
Consuming x 3hr ($3.00): React
Got a working "app" running! With functioning server and database, and a front-end with React!
Learning interest:
CodeWars Challenge ($2.00): Indexed Capitalization
Creating x 5hr ($5.00): React
Struggled on CodeWars, Can you win the codewar?, for 5 hours... and still couldn't solve it...
Learning interest:
charAt()
to go to specific index in a stringConsuming FreeCodeCamp Front-End Libraries ($1.00): React
Learning interest:
{this.state.display &&
display text
}
, to display text when display is true
Consuming FreeCodeCamp Front-End Libraries ($1.00): React
Learning interest:
componentDidMount()
is called after a component is mounted to the DOM. The best practice is to place API calls within componentDidMount()
.componentDidMount()
, and remove in componentWillUnmount()
.Consuming FreeCodeCamp Front-End Libraries ($1.00): React
Learning interest:
this.setState((state) => ({count: state.count++}));
({state.count++})
state
as an argument, we are not using this
. Since using this
to capture previous state is not reliable.CodeWars Challenge ($3.00): Grocer Grouping
Consuming FreeCodeCamp Front-End Libraries ($1.00): React
Learning interest:
MyComponent.defaultProps = {name: 'Lexi'}
.MyComponent.propTypes = { name:PropTypes.string }
. Must import PropTypes for it to work: import PropTypes from 'prop-types'
this
to methods in a Component within Constructor: this.handleClick = this.handleClick.bind(this)
.bind
is to use arrow functions for custom methods (experimental)...const MyComponent = createReactClass({...code})
Creating React Smart Brain Facial Recognition x 3 hours ($3.00): Introduction to SQL
Learning interest:
Creating React Smart Brain Facial Recognition x 2 hours ($2.00): Connecting server to front-end
Learning interest:
fetch
to look for server path for specific calls, such as registration, signin, image search...etc.Creating React Smart Brain Facial Recognition x 1 hours ($1.00): Learned to set up server with Node and Express for the smart brain app
Learning interest:
response
for server requests. Much like function must have return
.express()
. Usually assign it to const app = express();
app.use(express.json())
. app.use
is needed to initiate middlewares.Creating React Smart Brain Facial Recognition x 2 hours ($2.00): Finally get the basic front-end navgiation working! Woohoo! Now onto adding server and Node to my website!
Learning interest:
React.createContext
to pass down props
from grandparents to grandhildren. Didn't actually get to use it because I'm changing states...CodeWars Challenge ($2.00): Multiple of 5
Problem solving Advent of Code x 1 hours ($1.00 EXP)
Learning interest:
Creating React Smart Brain Facial Recognition x 1 hours ($1.00 EXP)
It'll be interesting to study how to setState should work, and how to manage React states.
Learning interest:
Creating React Smart Brain Facial Recognition x 1 hours ($1.00 EXP)
Reorganize components so I build the habit of proper file structure for React. Andrei kept saying how there are better ways to organize the components, so I figured I might as well do it right from the beginning... and also make my life harder to follow the tutorial, since I've customized it so much that I really have to figure out how to do it for myself, and not just follow along.
Learning interest:
Creating React Smart Brain Facial Recognition x 6 hours ($6.00 EXP)
Integrate facial recognition API to the website. Added functionality to make website more interactive, such as showing 'detect' button only when users enter valid image URL, and have placeholder image location when image are not loaded.
Visit WebsiteLearning interest:
div
tags LOL. I had to clean up the components, since passing props
through these 'fake' components doesn't make any sense.Creating React Smart Brain Facial Recognition x 7 hours ($7.00 EXP)
Mocked up design for Smart Brain facial recognition and built it using React
Learning interest:
git checkout -b newbranch
Coding Challenge ($2.00 EXP): Advent of Code 2019 Day 1
Learning interest:
.readFileSync
to store file into a variable. .readFile
does not work because it is asynchronous, so the time the variable is declared and the time the data is fetched is not aligned. Coding Challenge ($2.00 EXP): Advent of Code 2019 Day 1
Learning interest:
fs.readFile
instead of using console.log for cleaner code--dirname
to navigate file pathCoding Challenge ($2.00 EXP): Santa Helper with NodeJS
Consuming: Complete Web Developer ($1.00 EXP)
Learning interest:
.some()
to break out of function early. It's faster than using for
...loop and break
..some()
returns boolean value. To break out of function early, return boolean conditionCoding Challenge ($2.00 EXP): Halving Sum
Learning interest:
Coding Challenge ($4.00 EXP): Create Array of Integers, Largest Pair Sum
Learning interest:
Array.from
to generate an array. It accepts a callback function with arguments of (value, index)
Consuming: Complete Web Developer ($2.00 EXP)
Deployed my Robofriends React app. Took me forver to debug and deploy React to Github Pages...
Learning interest:
console.log
in the terminal by running node script.js
in the terminal.npm init
Consuming: Complete Web Developer ($1.00 EXP)
Learning interest:
componentDidMount()
with async componentDidMount()
Consuming: Complete Web Developer ($1.00 EXP)
Learning interest:
this.setState()
to update React component states. Do not use this.state.robots
to reassign the statethis
will refer to function that called it, instead of the object users interacted withpromises
to fetch API information, so the data fetching runs asychronously in the background as website continues to do its thingCoding Challenge ($3.00 EXP): Sort Sentence
Consuming: Complete Web Developer ($1.00 EXP)
Learning interest:
const {name, id} = props
to just use name
and id
by itself, rather than props.name
and props.id
Consuming: Complete Web Developer ($1.00 EXP)
Learning interest:
class
has more functionality than using function
. Class
has the ability to manipulate state and props.Coding Challenge ($2.00 EXP): Nested Even Sum
Consuming: Advanced JavaScript ($1.00 EXP)
Learning interest:
sum += nestedEvenSum(obj[key])
, is actually sum += 'returned sum'
Coding Challenge ($2.00 EXP): Find the capitals
Consuming: Advanced JavaScript ($1.00 EXP)
Learning interest:
npm install
rather than finding specific websites to install the packages. And some packages may not have a website and GUI version for installation.Coding Challenge ($6.00 EXP): Find pair difference, Find rotated index
Consuming: Advanced JavaScript ($1.00 EXP)
Learning interest:
import
and export
functions. Coding Challenge ($8.00 EXP): Capitalize first letter, Construct Note, min subarray length
Consuming: Advanced JavaScript ($1.00 EXP)
Learning interest:
Coding Challenge ($3.00 EXP): Food Allergies
Learning interest:
cd ~
to go to main user foldercd /
to go to root folder c:/mkdir fileFolder
create new folderecho "" > fileName
create new filemv fileName fileFolder
move filemv fileName newFileName
rename fileCoding Challenge ($3.00 EXP): Find within Array
Learning interest:
findIndex()
to find the first index that returns true.Coding Challenge ($3.00 EXP): Binary Golf Search
Creating ($2.00 EXP): JS30 Day 4: Array Cardio
Learning interest:
console.table
for more organized viewconst [firstName, lastName] = "Harry Potter".split(" ")
;Coding Challenge ($6.00 EXP): Frequency Sort, The Vowel Code
Learning interest:
find()
: Object.keys(hash).find(val => obj[val] === value);
.find()
returns the first element that matches the requirementsCoding Challenge ($6.00 EXP): flatten(), factorial
Learning interest:
Coding Challenge ($4.00 EXP): Longest sum of all contiguous subsequence
Consuming: Functional Programming Udemy ($1.00 EXP)
Learning interest:
console.log()
is affecting the window scope, thus has side-effects. Object.assign
Coding Challenge ($13.00 EXP): Reverse Array with Recursion, Count Letters, longest common subsequence, Find lowest index
Consuming: Object Oriented Programming Udemy ($1.00 EXP)
Learning interest:
Class
, and it's relationship to Object Oriented Programming! Thank you, Andre Neagoie!Class
bundles properites and methods cleanly together, without needing to instantiate methods everything time and eat away memory space, nor using .prototype to assign methods, which just makes it really confusing.Class
is still an Object
!Learning interest:
start
pivot
to track index of pivotstart
, if it's smaller, place to the left, if it's larger, place it to the right of pivot
.pivot
with start
Leveled up to level 6!! woohoo! Level 7 seems so far away...
Coding Challenge ($6.00 EXP): First non-repeating character, Flatten Array
Learning interest:
merge
, to help sort and merge the array. And recursively slice up the array into left and right segments until only 1 or less element left.Array.isArray()
to check if an element is an array.Coding Challenge ($5.00 EXP): Sorted Frequency, Find Duplicates
Consuming: Algorithm & Data Structures Udemy ($1.00 EXP)
Learning interest:
Math.floor(Math.abs(num) / Math.pow(10, n)) % 10
Array.from()
to create empty array. Array.from({length: 10}, () => [])
creates an array with 10 empty arraysCoding Challenge ($7.00 EXP): Count zeroes, Some Recursion, longest alphabetical substring
Consuming: Algorithm & Data Structures Udemy ($1.00 EXP)
Learning interest:
arr
, start
, and end
, and use
left
and right
segments as start
and end
recursively."a" < "z" == true
Consuming: Algorithm & Data Structures Udemy ($1.00 EXP)
Learning interest:
.sort()
method.Coding Challenge ($9.00 EXP): is subsequence, frequency counter, find palindrome using recursion, max subarray sum
Consuming: Algorithm & Data Structures Udemy ($1.00 EXP)
Learning interest:
CodeWars Challenge ($2.00 EXP): Find average pair
Consuming: Algorithm & Data Structures Udemy ($1.00 EXP)
Learning interest:
CodeWars Challenge ($3.00 EXP): Unique string characters, reverse (using recursion)
Consuming: Algorithm & Data Structures Udemy ($1.00 EXP)
Learning interest:
CodeWars Challenge ($3.00 EXP): Most Frequent Weekdays
Udemy is down today because of immoral / unethical people taking advantage of the public library... so I can't take any course :(
What would I learn the first 20 hours of coding? JavaScript. Get really really good at JavaScript.
Learning interest:
CodeWars Challenge ($5.00 EXP): Naughty or Nice?, Split and then add both sides of an array together
Consuming: JavaScript Udemy ($1.00 EXP)
Get to pratice recursion at Code Wars! I got too recursion happy and wrote two... the solution could be solved with one recursion though (and mush faster). Will need to refactor my code to make it cleaner and faster.
Learning interest:
charCodeAt()
.CodeWars Challenge ($2.00 EXP): Calculate mean and concatenate string
Consuming: JavaScript Udemy ($1.00 EXP)
Learning interest:
Number.isNaN()
to determine whether something is not a number or not. It's not reliable to just use equality operator for NaN
or use the global isNaN()
.Consuming: JavaScript Udemy ($1.00 EXP)
Completed JavasScript: Understanding the Weird Parts ($10.00 EXP)
Learning interest:
Shift()
and unshift()
have O(n) and push()
and pop()
have O(1).window.yourFunction
. Consuming: JavaScript Udemy ($1.00 EXP)
Learning interest:
Consuming: JavaScript Udemy ($1.00 EXP)
Learning interest:
return
. And the recursive code area should also have a return
as well.CodeWars Challenge ($6.00 EXP): Josephus Survivor, ATM
Consuming: JavaScript Udemy ($1.00 EXP)
Leveled up to 4 kyu on Code Wars!! Woohoo! And I think there is a lot for me to learn...
Learning interest:
if
statement.|
to do operations similar to Math.floor
. | 0
is the same as Math.floor
. I did speed test and both are equally fast. However, considering code readability, it still makes more sense to use Math.floor
.>>
and <<
. >> 1
is equivalent to Math.floor( x / 2)
, whereas << 1
is the same as 2 * n
CodeWars Challenge ($12.00 EXP): Sum the Array, Graceful Tipping, Split in Parts, Elements occurred more than n times, Replacement
Consuming: JavaScript Udemy ($1.00 EXP)
Learning interest:
~~
to convert values into numbers. Values such as false
to 0, true
to 1. Useful application for populating hash tables. Such as hash[num] = ~~hash[num] + 1
**
to find the power of a number. 2 ** 3 = 8.new Regex
. Such as let regex = new RegExp(`(\\w{1, ${variable}})`, "g");
CodeWars Challenge ($5.00 EXP): Ordered Count of Characters, Encrypt this
Consuming: JavaScript Udemy ($1.00 EXP)
Learning interest:
Class
. Should learn how to use Class
instead of object prototypes.For
loops will create operations in multiples of n.Consuming: JavaScript Udemy ($1.00 EXP)
Learning interest:
CodeWars Challenge ($2.00 EXP): Sum of Numbers
Consuming: JavaScript Udemy ($2.00 EXP)
Learning interest:
CodeWars Challenge ($7.00 EXP): Difference of 2, Total Amount of Points, validate password
Consuming: React Udemy ($1.00 EXP)
Learning interest:
reduce()
when final output is a number. {min, max}
at end of regex^
and $
to strictly match the regex, by capping it at the front with
^
and $
at the back.indexOf
to find matching number in an array, instead of using object literal.CodeWars Challenge($3.00 EXP): Check isomorphic words
Creating: CodeWars Challenge($4.00 EXP)
Well, I spent 4 hours coding today on two Code War challenges and I couldn't solve them. Got stuck on the time limit, even when I technically solved the problem :(
Learning interest: learned and practiced to debug with Firefox debugger.
CodeWars Challenge($4.00 EXP): Get planet name by ID, Your ride is here
I've started a new rule: for every manga chapter I read, I have to finish a coding challenge first. And the challenges quota expires daily. I follow 11 mangas weekly and 6 mangas monthly, so if I plan to read all my manga chapters, I will be doing 50 challenges per month :O (assuming all manga chapters come out... The Promised Neverland won't come out until 2 weeks from now TT^TT )
Holy shit... if I had started this rule from the very beginning, I would have practiced a lot already. Well, today is better than tomorrow.
Need to get my weekly manga priorities straight. These are the priorities, the rest will depend on my mood (Chainsaw man is getting good):
CodeWars Challenge($3.00 EXP): Number of Reduced Fractions
Attemped CodeWar challenge. While I was able to find a solution, it wasn't optimal enough to past the test.
CodeWars Challenge($4.00 EXP): Concatenating Functions
Learning Interest: learned about composed functions and Function prototpes.
CodeWars Challenge($8.00 EXP): Hash Tag Generator, ROT13
Learning Interest: It's more important to understand and practice Javascript before diving into topics for data structure and dynamic programming. I must have a narrow focus and understand the craft first before I start learning other fancy new tools, or I wouldn't know how to use the tools anyways.
I definitely over stretched myself for the LeetCode challenges. Their difficulties are way beyond my current level, to the point it's not productive. It's good to practice problems within my level, but I also need to stretch myself. Hmm. The art of deliberate practice...
CodeWars Challenge($3.00 EXP): Validate Credit Card Number
Learning Interest: learn about debugging
tool in Firefox (Through CS50). Instead of using console.log
to clutter code, use debugging tool to step
through the code to find bugs. Will need to dig deeper to understand how to use the debugging tool properly.
Learned about dynamic programming through LeetCode challenge. Maybe I'll learn more in CS50?
Leetcode Challenge($2.00 EXP)
Consuming Harvard CS50($1.00 EXP)
Learning Interest: learned about basic C language in CS50 course. Solved Mario problem for week 1.
Consuming React on Enki & React Documentation($1.00 EXP)
Learning interest: learned about using Map()
instead of object literals as dictionaries/hash tables. Map performs better in scenarios involving frequent additions and removals of key-value pairs.
Learned the hard way to always test your websites in different browsers. It turned out my Roxborough Master Plan website broke completely in Edge. Ughhh. Also, I need to figure out performance issue for the website, so it loads images faster. Maybe need to try lazy loading or resizing the images base on device.
And~ turns out the website now fails to load Google Analytics script. Ughh! So this is what it's like to work on real projects.
Consuming React on Enki & React Documentation($1.00 EXP)
Learning interest: how to add React to HTML. It's
VERY IMPORTANT to specify script type for jsx to work properly with type="text/jsx"
! Or JavaScript
and browser will not read JSX! Install JSX to project with terminal or cdn link
Learned about bitwise operators in JavaScript. Not sure when exactly I'd need to use it...
Consuming React on Enki & React Documentation($1.00 EXP)
Consuming: Harvard CS 50 & Binary Search($1.00 EXP)
Learning Interest: one solution to find the leftmost column with 1 is to traverse the grid from top right corner, and go down until hitting 1, if it's one, go left to find the leftmost column.I think the matrix constructor through me off...
First class of CS50 was fundamental programming ideas, such as loops, conditionals, and variables. It's good to learn what bits and bites (8-bits) mean, and how computers think in 0s and 1s. It makes sense now that fromCharCode()
starts at 65 for A and 91 for a. It's because people decided a while ago that those random numbers would be the UTF-16 code for letters.
Consuming: Binary Search Trees ($1.00 EXP)
Learning Interest: apparently binary search tree advantages are adding, deleting and searching data. Like binary search, binary search tree eliminates half of the options to expedite search.
Breadth First Search: going horizontally through each child first, before progress to grandchilren.
I'll need to create diagrams for preOrder, inOrder, and postOrder this weekend...
LeetCode/CodeWars Challenge ($4.00 EXP): Search in Rotated Sorted Array
Learning Interest: learned about using binary search. The essence of binary search is to search faster by eliminating half of the candidates. It's most applicated in a sorted array.
It's the same logic of guessing a random number between 1 and 10. You start guessing in the middle, 5. And the other person will tell you whether the number is too high, so you scrap numbers higher than 5. Or vice versa.
LeetCode/CodeWars Challenge ($4.00 EXP): Minimum Path Sum, Minimum Path in Squares
Creating x 2hrs ($2.00 EXP):set up image slider with CSS and write JavaScript to hake slider reponsive
Learning Interest: learned about reference of array versus copy of values of the array. (value vs reference). When assigning array to another array using =, you're actually just creating a reference to the original array. Which means when you make modifications to the second array, original array will change too. To copy values of the array, use either slice
or concat
. I created an empty array for Minimum Path in Squares to store the values using let grid = [...Array(rows)].map(x => Array(columns))
, since the array is multi-dimensional.
I've always struggled with 2 dimensional arrays, however, this time it helps A LOT to think of arbitrary
i
and j
as rows
and columns
in a grid. Or rows (y) and
columns (x). I will need to stay away from using i
and j
in the future, so I don't confuse myself further.
Blue line shows how for
loop traverses if you nestle j
in i
, a typical
usage for 2D array.
LeetCode/CodeWars Challenge ($3.00 EXP): Number of Islands
Learning Interest: well, learned I'm struggling on Leetcode is because I haven't learned any of the CS fundamental concepts such as data structure... Number of Islands Challenge was part of the Queue & Stack category. I tried to work on the card, but it seems the concept is very different from Javascript, since Javascript has no queue function... I think in the end, the 30-days challenge is a good primer to software engineering.
Edit: found data strcuture using JavaScript!
LeetCode/CodeWars Challenge ($3.00 EXP): Valid Parenthesis String, Valid Parenthesis
Learning Interest: when try to keep track of two items, use two variables to store the values. Such as '(' and ')' and '0' and '1'.Product of Array Except Self also tackles the problem from two ends of the array and two variables to exclude self.
Thinking in object literal and two Variables will provide more sophisticated problem solving.
LeetCode/CodeWars Challenge ($10.00 EXP): Product of Array Except Self, First Unique Character in a String, Find the Unique String
LeetCode/CodeWars Challenge ($3.00 EXP): Perform String Shifts
Creating x 3hrs ($3.00 EXP): Creating Roxborough Master Plan Website
Learning Interest: Create interactive map for Roxborough! Learn to place interactive icons on map with CSS absolute
positioning. It's important to make sure the parent node is set to relative
, and set the icons to absolute
. And use % to make sure the icons stay in the same place when map resizes.
This will be a useful tool for future website. Next time I could add animation, such as pulsing, when hovering over icons.
LeetCode/CodeWars Challenge ($4.00 EXP): Contiguous Array
Learning Interest: Leetcode challenges use a lot of hash tables. If I ever get stuck, it's good to think of a hash table solution first.
LeetCode/CodeWars Challenge ($7.00 EXP): Sort - one, three, two, Last Stone Weight
Learning Interest: Learn from the Enki app that data structures are just different ways to organize and retreive data. Each data structure has its own advantages and disadvantages. Just like a closet, you could organize clothes by folding them and arrange them in different color piles. Or just dump all the clothes on the ground. While dumping clothes on the ground is easier upfront, but when retreive the clothes before work will be more tedious. And while folding clothes takes more time upfront, it'll be much easier to retrieve the clothes before work.
Also, learned to use localCompare
in conjuction with sort
to sort through strings in the Sort exercise.
LeetCode/CodeWars Challenge ($6.00 EXP): Diameter of Binary Tree, Longest Palidrome
Learning Interest: learned about another data structure - binary trees. Another thing that I'm not sure if it'll be useful for front-end development... But I guess something to be aware of.
React properties should stay immutable. Properties can be modified by parents, but not the component itself.
LeetCode/CodeWars Challenge ($3.00 EXP): Min Stack
LeetCode/CodeWars Challenge ($7.00 EXP): Backspace String Compare, Backspaces in string, extract the domain name
Creating x 3hrs ($3.00 EXP): Creating Roxborough Master Plan Website
Learning Interest: learned about blockchain and how it is immutable through unique hash (much like an address) and multiple copies (decentralized). It's concept is pretty similar to linked list, such as originating from a head and node linking to next node. However, it's more complex than linked list.
LeetCode/CodeWars Challenge ($3.00 EXP): Middle of the Linked List
Creating x 5hrs ($5.00 EXP): Creating Roxborough Master Plan Website: working with images and font awesome
Apparently linked lists are like scavenger hunt, you start at step 1, once you get to step 2, you'll find prompt for step 3... etc. Here is an explanation of linked list vs array. I tried Google around to find out WHY use linked list with JavaScript and web development... and cannot find any reasons... Not sure if I'll ever use Linked List with JavaScript... seems like an very theoretical concept (not my cup of tea -____- ).
Learning Interest: learned about linked list. Though cannot find a good practical use of it... Learned to use two speed, fast and slow, to find middle point of a linked list. Seems like a very cool and useful concept.
LeetCode/CodeWars Challenge ($3.00 EXP): Counting Elements
Creating x 2hrs ($2.00 EXP): Creating Roxborough Master Plan Website: HTML tables
Took me at 2 hours to figure out this question... I was right about using a hashset, but it took me a long time to figure out I need to use two loops to figure the solution. I have a feeling later questions from 30-day challenge will take me a longer to solve...
Learning Interest: use object literal to create a hashset. And loop through to see if elements exists in the hashset.
LeetCode/CodeWars Challenge ($5.00 EXP): Group Anagram, Anagram Detection
Creating x 3hrs ($3.00 EXP): Creating Roxborough Master Plan Website: HTML tables
Learning Interest: using colspan
to span text over multiple cells in HTML tables.
Use hash table / object literal to compare items, such as anagram. Need to create keys
to keep track of items for comparison, and use values
to store actual item from an array.
LeetCode/CodeWars Challenge ($3.00 EXP): best time to buy and sell stock II, two sum
Learning Interest: "To collect data from multiple children, or to have two child components communicate with each other, you need to declare the shared state in their parent component instead. The parent component can pass the state back down to the children by using props; this keeps the child components in sync with each other and with the parent component." - React Tutorial
I need to learn React from scratch again. The tutorial from React is too complex and I need to spend more time dissecting the why of each line of code...
LeetCode/CodeWars Challenge ($7.00 EXP): Two Sums, Moving Zeroes
Well, apprently LeetCode easy questions are all ranked 6 kyu or 5 kyu. I will be starting with LeetCode questions (April's 30-Day Challenge and Top Interview Question - Easy Collection), and rework them at CodeWars and use CodeWars ranking for my EXP. Rework because the questions differs slightly.
Learning Interest: worked on Two Sum again and learned to use object to track value and indice. Creating another object seems like a good way to track values of interest. Also used object to track and store how many times a number repeats in an array. Two Sum can use object to find 'missing half' of the sum within an array.
Will need to look into hashmap.
LeetCode Easy Algorithm ($2.00 EXP): Maximum Subarray
CodeWars Challenges ($3.00 EXP): Happy Numbers
Learning Interest:looks like easy questions in LeetCode is 6kyu or 5 kyu on CodeWar... CodeWars has variation of Happy Numbers and Maximum Subarray. It's good to practice these questions again with a slightly different twist. But... how do I account for the EXP?
Also... looks like I'm only considered intermediate for coding bootcamp placement challange
LeetCode Easy Algorithm ($2.00 EXP): Happy Number
Learning Interest: with happy number, the 'unhappy' numbers will continue to loop endlessly. To prevent the function from running endless and still return false
, create a counter variable to track count. I wonder if there is also a more efficient way to track count without knowing the limit and also tracking repeated number with an array. Some people used Set
to use it's has
method. But what if the number never repeats?!
Also, I'm doing LeetCode's April 30-Day challenge. The goal is to finish the challenge everyday and record my learning.
Creating x 6hrs ($6.00 EXP): Creating Roxborough Master Plan Website content page.
Created table of content in JavaScript! Practicing construction document's motto: do it once and do it at the right place. I've thought about how to best create TOC without copying it multiple times with HTML pages, since we all know things will change... I'd much rather change it in one place and let everything automatically updates, than copying and pasting in multiple HTML pages. The method I used was to create an object
of pages, with properties of page name and CSS classes for styling. And generated href links based on page name. I've also utilized JavaScript class
for the first time! I created a class of page, and use it to construct new pages within my page object
.
Learning Interest: Learned about Emmet abbreviation today. Had to populate HTML pages with RVMD doc, and Emmet made my life slightly easier (still a lot of copy and pasting, but at least somewhat streamlined it). Pretty cool stuff!
Creating x 7hrs ($7.00 EXP): Creating Roxborough Master Plan Website content page. Automating content as much as I can with JavaScript, such as subsection table of contents based on sections, and previous/next sections button with main TOC.
Learning Interest: Learned about hashchange
with Event Listener to work with page anchors (ids). And location.hash
to work directly with url.
Learned JavaScript file orgnization from Mozilla A-Frame. Create stand-alone function for each task, and call the functions immediately. I should go back and clean up my JavaScript files.
Leetcode Easy Algorithm ($2.00 EXP): Plus One
Creating x 4hrs ($4.00 EXP): Creating Roxborough Master Plan Website landing page. I think CSS grid is definitely easier to deal with than flex! Most of the home page is ready to go, last step is add footer and interactive hamburger menu.
Leetcode Easy Algorithm ($2.00 EXP): Intersection of Two Arrays
Creating x 3hrs ($3.00 EXP): Update home page to include gamification stats. Write JavaScript to automatically update level bar and current level.
Leetcode Easy Algorithm ($8.00 EXP): Single Number, Contains Duplicates, Best Time to Buy Stock, Rotate Array
Learned about Bitwise operator XOR
(^). With a ^ b
, returns 1 if numbers are different, 0 if numbers are same. XOR can be
unpredictable, and it only worked for the
Single Number question because "every element appears twice except for one", so using XOR, the element that
appears twice cancelled each other out, leaving the only element that appears once.
One quick way to remove duplicates in an array and still keep the array type is [...new Set(arr)]
Leetcode Easy Algorithm ($2.00 EXP):Remove Duplicates from Sorted Array
Leetcode Easy Algorithm ($2.00 EXP):Square of a Sorted Array
Leetcode Easy Algorithm ($6.00 EXP):Self dividing numbers, maximum 69 number, Decrypt String from Alphabet to Integer Mapping
Leetcode Easy Algorithm ($4.00 EXP): Create Target Array in the Given Order, How many number are smaller than the current number
COMPLETED FreeCodeCamp JavaScript Algorithms and Data Structures Certification!($100.00 EXP)
FreeCodeCamp Intermediate Algorithm ($12.00 EXP): Wherefore art thou, Make a Person, Telephone Number Validator, Map the Debris, Smallest Common Multiple, Cash Register
LEVELED UP TO LEVEL 5! WOO!
Was debating how much money I should give myself for completing the certification, and it looks like I started the certification allll the way back in November 25, 2018. After 16 months, I finally finish the certificate! Better give myself a pat in the back!
I think today is one of those moment where I just keep receiving experience points, and my character just keeps flashing and powering up!
Consuming FreeCodeCamp x 2hr ($1.00 EXP): Learning about recursion, closure, and callback functions.
Understanding call stack for JavaScript. Recursion is like Inception, dream within a dream. And without providing an end, it will result in too much recursion and goes into limbo. With JavaScript function call stack and recursion, the function goes within the most inner layer (dream/function) and return results from inner function to outer function again.
A closure is any function that keeps reference to variables from its parent’s scope even after the parent has returned -sitepoint. Closure scope chain: local scope, outer functions scope, globals scope.
Callbacks make sure that a function is not going to run before a task is completed but will run right after the task has completed. - freeCodeCamp
FreeCodeCamp Intermediate Algorithm ($2.00 EXP): Argument Optional
FreeCodeCamp Intermediate Algorithm ($8.00 EXP): Everything Be True, Binary Agent, Steamroller, Drop it
FreeCodeCamp Intermediate Algorithm ($6.00 EXP): Convert HTML entities, Sum All Odd Fibonacci Numbers, Sum All Primes
Need to look more into replace()
.
Seems like I can use function
within replace
?
Will need to practice more algorithm with Fibonacci and prime numbers on CodeWars.
FreeCodeCamp Intermediate Algorithm ($15.00 EXP): Spinal Tap Case, Pig Latin, Search and Replace, DNA Pairing, Missing Letter.
I'm surpringly able to solve all Free Code Camp's problems on my own. I think training in the dungeon(CodeWar) did help :O
Creating x 1hrs ($1.00): FreeCodeCamp Wherefore art thou
Attemped Free Code Camp's Intermediate Algorithm...
Learned about every()
.
Seems like a useful method in conjunction with .filter
, since every
return values in
Boolean- whether every value within the array passes the test, or not.
Creating x 1hrs ($1.00 EXP): FreeCodeCamp Wherefore art thou
Attemped Free Code Camp's Intermediate Algorithm...
CodeWar Challenge ($9.00 EXP ) + Creating x 3hrs ($3.00 EXP): Persistent Bugger, break camelCase, split strings
Finally leveled up to 5 kyu! Struggled forever on Yes No kata... and still didn't solve it...
Slowly learning CSS Grid with Wes Bos.
Consuming x 2hr ($1.00 EXP): CSS Grid
I think I need real life applications before diving into the specifics.
CodeWar Challenge ($3.00 EXP): who likes it?
When there are multiple else...if
statements, it's faster to use switch
.
CodeWar Challenge ($3.00 EXP): Replace With Alphabet Position
Ended up using brute force to solve the problem: by converting string
to array
,
process using map
and convert back to string
.
CodeWar Challenge ($12.00 EXP) + Creating x 5hr ($5.00 EXP): consonant value, Pokemon damage calculator, two joggers, counting duplicates
My current process includes solving the challenges and compare JavaScript speed with other solutions using JSBench.me. While Codewar has many solutions, they're not necessarily the fastest.
LEVELED UP TO LEVEL 4! WOO!
CodeWar Challenge ($6.00 EXP) + Creating x 3hr ($3.00 EXP): +1 to Array, socialist distribution
Tried convert array to string to number to do the math, but because the test numbers are too big,
ParseInt()
and Number()
were not able to convert string to number properly. I had to use BigInt
()
to
convert string to number, but then couldn't do any arithmetic with BigInt
...
Ended up having to use for
loops to calculate the final number. I think I'm getting used to use
multiple methods to reach the final solution - I had to use several if
statements and
for
loops to exit out the function sooner to optimize the function.
Consuming ($1.00 EXP): Enki
CodeWar Challenge ($3.00 EXP): Detect Pangram
Next step: refactor code and see if I could apply some "short circuiting" tips.
Consuming ($1.00 EXP): Learning on Enki app.
Learned "short circuiting" using || and && to simplify the code. I should try to apply these trick in my future codes.
Consuming ($1.00 EXP): Learning on Enki app.
Enki seems like a fun app so far. I like how it goes into details of for...in
and
for...of
Consuming ($1.00 EXP): Learning on Codecademy and Enki mobile app.
Looking for coding challenge apps that I could practice on my phone...
CodeWar Challenge ($3.00 EXP): Split String
Consuming ($1.00 EXP): Learn about for...in
and for...of
Use for...in
to iterate through objects, and use for...of
to iterate through
iterables, such as array, string, set, map...etc.
To help remember this,think "inside" objects, real life objects like a box.
Also... I need to clean up the Illustrator codes.
Code Challenge ($3.00 EXP): Find the odd int
To iterate through object, use For...in
.
To iterate through array, use forEach()
.
To count duplicates in an array, could use reduce()
to create an object, or use
foEach
to populate the object. Once the object is create, use for...in
to find value
within object that matches the criteria, in this case, key that repeated odd number of times.
Code Challenge ($4.00 EXP): Two Oldest Ages, Growth of a Poppulation
Code Challenge ($4.00 EXP): Step to Zero, Jewels & Stones
Looks like reduce()
calculates faster than filter()
, even if they both use
includes()
. I wonder if it's because reduce
return a single number, whereas
filter
still return an array of number.
Code Challenge ($2.00 EXP): Even from Odd
Creating x 2hr ($2.00 EXP):Developed script in Illustrator to calcuate areas of the selected polygons, and automatically create text label for each polygon. Bye bye CAD!
Feeling super proud of myself for developing the script in Illustrator to bypass CAD. The previous 'manual' workflow would require redrawing the polygons in CAD to measure their areas in square feet, use online calculator to convert sq ft to acres, and back to Illustrator to create the labels. Imagine repeat this step for 20 polygons, and with client constantly changing the design every other week. Now I can just quickly draw up a "technical" bubble diagram in Illustrator and let the script do the calculation and labeling for me.
Set()
is a great way to filter out duplicates in an array. Would have to use
Array.from
to turn Set
back to Array
. This website also offers other ways to
get rid of duplicates, such as filter()
.
Attemped another 6kyu. Having trouble making script run faster. It seems like while
loops are
faster than for
loops. Haven't completely decipher the solutions yet...
Creating x 2 hours ($2.00 EXP): JavaScript in Illustrator
Write JavaScript with Adobe ExtendScript to automate calculations within Illustrator. The idea is to make Illustrator diagrams more technical, such as assinging line width to reflect actual width in feet, and caluclating areas in square feet or acres and parking spaces to guage how much program can fit in an Illustrator's bubble diagram.
Next step is to auto label areas based on the selection size... we will see how it goes.
Creating x 1 hours ($1.00 EXP): JavaScript Doodles
Using doodles to understand JS concepts, such as objects. Sketched out bags as a class
, and each
Cotopaxi bags as subclasses
. Same can be applied with cat as a class
, and lion as its
subclass
.
Creating x 1 hours ($1.00 EXP): JavaScript30 Project 3: CSS Variables with JS
Properly assigned range input to JavaScript and use JavaScrip to update the CSS variables in root.
Use JavaScript to select distance and assign it to shadowDistance
and
highlightDistance
.
Next step: figure out how to calculate shadow colors and highlight colors based on selected color with JavaScript. Will likely need to convert hex to rbg to hsl...
Code Challenge: FreeCodeCamp Algorithm ($2.00 EXP):
Creating x 1.5 hours ($2.50 EXP): JavaScript30 Project 3: CSS Variables with JS
Instead of the building the same exercise as JS30, I've decided to build a Neumorphism Demo. Maybe further design it to compare Neumorphism and Material Design in later iterations.
Learned to use style.setProperty(propertyName,
value)
to adjust CSS with JS. With propertyName assigned to 'name' in inputs, I select the right
CSS for JS to update value.
Creating x 1.5 hours ($2.50 EXP): JavaScript30 Project 2: CSS + JS Clock
Finished the exercise ($1 EXP). Learned to calculate degrees and CSS display. Found a stock photo from Unsplash, and code the clock and animation with CSS and JavaScript.
Next step: animation is very choppy when second hands reaches 60. Need to troubleshoot and double check on hand locations.
CodeWar Challenge ($4.00 EXP): Count letters and digits, pandemia
Coding exercise warm-up to get me back to code challenges. Realized the "shortest" code in CodeWars isn't
necessary the fastest code. Less operations and methods, such as split()
,
reduce()
...etc. the faster the code. So simple codes are faster. Also the less variables I
have, the faster it is. However, I'd prefer to keep my code legible. If variables help me explain my thinking,
I'd prefer to keep it... for my future self's sanity.
Creating x 1hr ($2.00 EXP):JavaScript30 Project 1: Drum Kit
Refine code to make code DRY.
Keydown event listener
can be identified through event.keycode
. While mouse clicks
are identified through this
. Because key presses are specific, while mouse clicks are more general.
Therefore, I currently couldn't find a clean way to write one function that works both for keydown
and mousedown
event handler. Maybe there is a way?
Next step: rewrite the code from scratch again. I also need to get back to Leetcode or CodeWars to practice simple algorithm problems.
Creating x 1hr ($2.00 EXP):JavaScript30 Project 1: Drum Kit
Added eventListener
to play sound with mouse click.
Next step: clean up code and make code DRY.
Creating x 1hr ($2.00 EXP): JavaScript30 Project 1: Drum Kit, generate random colors with each key press
Next step: play sound and generate random colors from mouse click.
Creating x 3hr ($6.00 EXP): JavaScript30 Project 1: Drum Kit
Learned new eventListener
- transitioned
to listen to when CSS transition has completed.
Use data-
to add custom attributes, such as data-key
to specify keyboard input.
Next step: generate random colors with each key press.
Consuming ($0.50 EXP): MDN's JSON tutorial
JSON files are JavaScript objects and arrays. JSON exists as a string for easier data trasmittal across networks. To work with JSON, you must convert it to JavaScript. JSON is purely data, it only contains properties, no methods.
Use XMLHttpRequest
to obtain JSON from an URL.
Consuming ($0.50 EXP): MDN's JS object tutorial: class.
Learn to write Javascript class and use getter and setter to assign values. Getters and setters work in pairs.
Use _ to create separate value from getter/setter property, so that this._subject
differs from get
subject()
's subject.
If this.subject = subject
, and you still use subject
for getter and setter, then
it'll create a recursion problem if set subject(newSubject) {this.subject = newSubject}
"Ultimately, objects are just another form of code reuse, like functions or loops, with their own specific roles and advantages. If you find yourself creating a bunch of related variables and functions and want to track them all together and package them neatly, an object is a good idea. Objects are also very useful when you want to pass a collection of data from one place to another. Both of these things can be achieved without use of constructors or inheritance. If you only need a single instance of an object, then you are probably better off just using an object literal, and you certainly don't need inheritance." MDN
Consuming ($0.50 EXP): MDN's JS object tutorial.
Using plain old for
loop and if
statements are faster than using split()
and join()
methods, even though the code is longer. Shorter code doesn't mean it is faster, if it
requires calculation. Write faster code will scale better with larger data sets.
Use inheritance from other object with call(this)
. Include parameters, such as age, gender, if the
constructor you're inheriting take its property values from parameters. (ie call(this, age,
gender)
) If not, do not need to include additional arguments other than this
.
Consuming ($0.50 EXP): Easing back into coding with MDN's JS object tutorial.
Code Challenge on LeetCode ($2.00 EXP): Two Sum. Failed the submission twice... and ended up using "brute force" way of solving it through loops.
To speed things up, the solution suggested using "hash table" - what? Started researching on Hash Table, and kept running into foreign words like chaning, collision and functions relating to Big O notation<EMAIL_ADDRESS>And~~ time to go back to reading and learning the basics!
Code Challenge on LeetCode ($4.00 EXP)
Learn a faster way to convert string array to numbers: map(Number)
Reading article on how to write faster JavaScript codes. Started using LeetCode to see how fast my code executes. My goal is to practice writing faster codes.
JSBench test code speed
Consuming: Object prototypes ($0.50 EXP)
Prototype
is a property containing an object on which you define members that you want to be
inherited. Methods and
properties are not copied from one object to another in the prototype chain. They are accessed by walking up the
chain. A common pattern for object definition is to have properties inside the constructor, and methods on the
prototypes. Example.
Remember, methods are functions. So keep static information, properties, inside constructor, and define methods,
or functions, as Object.prototype.methods
.
Attemping 6 kyu challenges on Code Wars. The difficulty increased expontentially... while it's extremely frustrating, I realized I don't know what I don't know. So, I've decided to go back to the basics and learn JavaScript Turtorials from MDN. Starting with objects.
Maybe I'll still do easy 7 kyu warmups, so I still get my daily practice in.
And~~~ the auto-populating date doesn't work XD Just as I suspected, it only remembers the first day, and the rest is gone like Goldfish's memory.
Creating: solving problem on Code Wars ($1.00 EXP). Still working on the problem...
Added script to automatically populate date. My question would be, would .unshift()
today's date
into an empty array would be there tomorrow? Or the array would refresh to an empty array again? Guess
we will find out tomorrow. Dun dun dun! I think they will all refresh and reset, since the data is not stored
somewhere...
Current logic for pushing today's date into the array: I created two variables to track date and content, if the date and content are different, then generate and print today's date. The list is then "supposedly" being kept in an array, that will loop through DOM to populate the dates.
Code Challenge on Code War ($6.00 EXP): digital root, VaccineNation
Recursion in JavaScript. It's similar to loops, but calling function within the function itself. Just like loops, you must identify when it ends, or you will get InternalError: too much recursion
for...
in
iterate over all enumberable properties object that are keyed by strings. What are enumerable
properties? Seems like enumerable properties are properties from Object Literals, and not from prototypes.
for...in is built for iterating object properties, not recommended for use with arrays.
Syntax: for (variable in object)
Code Challenge on Code War ($9.00 EXP): Shortest word, factorial, isogram, multiple of 3 or 5
Learned about Math.min()
to return the smallest number. If entering array into the argument, must use ...array
. There is
also Math.max()
to find the largest number.
Learned using Set()
constructor's property .size
to return number of unique elements in a Set
object. This is espeically helpful for the isogram
challenge.
Code Challenge on Code War ($7.00 EXP): House Number Sum, Keep Hyrdrated, NBA Full 48min average, and Find divisible numbers, absent vowel.
Provide initialValue
to .reduce()
method to return provided value when array is
empty. Learn more about reduce().
Using for..in
statement to loop through strings, such as for(let i in vowels)
. Do not
use for...in
for arrays, since index order is
important in array.
Code Challenge on Code War ($6.00 EXP): Find the middle number and Summing a number's digits
Learned to use Array.prototype.sort()
.
The caveat with .sort()
is that it sorts with the first digit, since it converts array elements to
strings and compare them in UTF-16 code unit order. For example, .sort()
will see 10 as smaller
than 5, because 10 starts with 1. In order for .sort()
to work properly and truly sorting numbers
from small to large, you must write function to let it knows how to compare: .sort((a,b) => a - b)
.
compareFunction within .sort()
seems like simple substraction, but it's running it's own
calculation comparing a
and b
. With a -b
, if a
is less than
b
, the function will return -1
, thus placing a
before b
. If
a
is greater than b
, funtion will return 1
, and place a
after b
. If a = b
, then function will return 0
.
To sort array into descending order, use b - a
.
Also, if you don't want to have .sort()
apply to original array, must clone the origin array to
another varible with [...array]
, instead of newArr = oldArr
. Even if you apply
.sort()
to newArr
, oldArr
will be sorted as well.
Learn
Math.abs()
to convert negative numbers to positive numbers. And use
.reduce()
to add all numbers within an array.
Consuming MDN JavasScript Array tutorial ($0.50 EXP). Array method:
Code Challenge on Code War ($3.00 EXP): String Ends with?
Learned to insert variables into regex using a Regex Constructor.
new RegExp(`${variable}`, 'gi');
Consuming MDN JavasScript tutorial ($0.50 EXP).
Consuming Free Code Camp Algorithm ($0.50 EXP): Diff Two Arrays
Learned using .filter()
and .includes()
to
searching through an array and find the differences. Use arrow function within .filter()
to create
specific search query. .filter()
only accepts functions as arugment.
Code Challenge Dungeon on CodeWar ($3 EXP): completed Alphabetical Addition.
Need to circle back on .reduce()
and .map()
Code Challenge Dungeon on Hacker Rank ($2 EXP) and CodeWar ($5 EXP): Checked out Hacker Rank and finished Compare the Triplets challenge.
I think I will continue using Code War, so I can review how other people write their codes. Hacker Rank coding interface has a lot of cluster and doesn't provide opportunities to view other people's solutions.
CodeWar Dungeon, compeleted two 8 kyu katas ($4.00 EXP): Tips calculator and Convert String to a Number
Will need to refactor my Tips Caculator code to best practices.
Leveled up! To level 3!
Consuming ($0.50 EXP): Intersection Observer. Intersection Observer methods and API.
Consuming ($0.50 EXP): well, lazy loading cats didn't work. Will need to troubleshoot and figure what the problem was. Also need to find other examples to see how people do lazy loading.
 At entry 50, a button to load more will be available, and users have the option to load 50 more entries, until another load more entry shows us.
Consuming ($0.50 EXP): Intersection Observer. Intersection Observer methods and API.
Consuming ($0.50 EXP): NodeList vs Array. NodeList is a browser API, whereas array is for JavaScript. While NodeList is array-like, it doens't have array funciton such as push(), pop(), slice()...etc. And you usually convert NodeList to array if other people are using it, since they will be expeciting an array instead of NodeList.
let Array = [].slice.call(document.querySelectorAll('p'));
let nodeList = document.querySelectorAll('p');
Next step: looking to implement lazy loading for the posts.
Creating ($2.50 EXP): Record Raman Numeral Converter into my mini JS website. Created Caesars Cipher to decode ROT13 code.
I will need to clean up Mini JS stylel to accomodate for multiple mini JavaScript programs. Such as classes for display and ID for interacting with JavaScript.
Completed one mini JavaScript exercise ($2 EXP): Caesars Cipher. Created regex to identify non-characters. If
the input is a character, shift 13 spaces to find the right letter. Somehow the character regex didn't work, and
would toggle between true
and false
even though it's the exact same input... but
non-character regex worked, so I had to use double negative.
Creating for two hours ($1.00 EXP) : Write JavaScript function that converts numbers to roman numerals. (mini project $2 EXP)
First figure out logic for the roman numerals, and figure out break points for letters. I've decided to create
objects
and use key
value
pair for the roman numerals and numbers,
because
it's easier for me to understand rather than having 2 separapte arrays. However, using
object.keys()
results in strings
, so I converted the string
to numbers
and store in
another
array. (uh, does this even make sense then?)
Another problem I encountered with using object
is that the .keys()
and
.values()
are stored from small to large. So when I need to create my for
loops, I
need to
cycle from the last number, the largest number, back to 0.
Creating ($0.50 EXP): set all anchor tags with web links to automically open up a new browser tab.
Consuming ($0.25 EXP): Researching portfolio examples
Websites I love:
Creating for two hours ($1.00 EXP) : Write JavaScript function that converts numbers to roman numerals. (mini project $2 EXP)
First figure out logic for the roman numerals, and figure out break points for letters. I've decided to create
objects
and use key
value
pair for the roman numerals and numbers,
because it's easier for me to understand rather than having 2 separapte arrays. However, using
object.keys()
results in strings
, so I converted the string
to
numbers
and store in another array. (uh, does this even make sense then?)
Another problem I encountered with using object
is that the .keys()
and
.values()
are stored from small to large. So when I need to create my for
loops, I
need to cycle from the last number, the largest number, back to 0.
Creating ($0.50 EXP): set all anchor tags with web links to automically open up a new browser tab.
Consuming ($0.25 EXP): Researching portfolio examples
Websites I love:
Creating ($0.50 EXP): Using JavaScript to auto populate hlc navigation links. Using construction document concept: say it once and say it in the right place, and 'DRY' - do not repeat yourself concept, it makes sense to use JavaScript to create the fixed navigation for hlc. Since I will only need to write the code once, in JavaScript, and the navigation menu will appear on all pages.
Attemps to automate navigation menu
classes
to show current page.innerText
and auto populate anchor tags. Will need to write anchor tags for the entire
list.
Need to only write the HTML once in JavaScript instead of copy and pasting into multiplage HTML pages.Next step: figure out how to create the navigation in JavaScript that will auto populate anchor tag attributes, look for which page is current and set class to current, and only need to write the HTML once in JavaScript.
Consuming ($0.25 EXP): learning Sass.
$variableName
. This is already available with current CSS, with
--root
.@mixin box-shadow($x, $y, $blur, $c)
for browser prefixes. Super useful for making sure CSS
works
in different browsers.@if
and @else
if just like JavaScript. Use with @mixin
to have a
block of
code.@for $i from 1 through 12 { .col-#{$i} { width: 100%/12 * $i; }}
Useful for creating columns
for
layout.@each $color in blue, red, green { .#{$color}-text {color: $color;}}
Creating ($0.50 EXP): update this website. Inject navbar from JavaScript to HTML, so I only need to create the navbar once, and apply to other pages.
Problem regarding automating daily log meta data - auto generate levels and date based on the day of recording, and still keep previous records... Think of log as an object with level, date and exp info.
Consuming ($0.25 EXP): Classes in JavaScript are functions. Classes offer a more concise and clear way of organizing object blueprints.
Think of classes
as RPG classes, each class has name, level, and class-specific skills.
Creating ($0.50 EXP): update this website. Auto populate level table with JavaScript based on level euqaution.
Props should act as "pure" function, meaning not change its own input. Such as function sum(a,b) { return
a + b};
So...I've been thinking... React is more complex than I anticipated and I still need to master JavaScript. I am getting more confused by React and will definitely need more time for the new concepts to sink in. And I wonder, the reason I wanted to use React is to create template for html pages, is there a way to do that with Vanilla JavaScript? Maybe I need to look deeper into this option before I confuse myself further with React.
I don't think learning React was useless, I did learn something - I need to find solution from what I know already, and sink my teeth into JavaScript first, instead of chasing after something else.
I will need to revisit my website and HLC website from JavaScript lens.
This article from Wes Bos explains how to inject HTML using JavaScript.
Thinking in React - helping me understand why use React and how React is used in real life application.
props
and not state
. "...
props
are a way of passing data from parent to child. ... State
is reserved only for
interactivity, that is, data
that changes over time." - React GuideI need to read this documentation more and have a better grasp of React state, props, and components to continue Codecademy's lesson.
A React component should use props
to store information that can be changed, but can only be
changed by a different component.
A React component should use state
to store information that the component itself can
change.
...what are some examples of React? why do we use state and props?
Anytime this.setState()
is called, it automatically calls .render()
as soon as the
state has changed. This is why we cannot call this.setState()
inside .render()
,
because it would create an infinite loop.
Quest completed: Codecademy React Part I! $5 EXP rewarded!
What is promise()
in JavaScript? A promise
allows JavaScript to run asynchronously.
JavaScript typically runs in a singular thread and execute code in order. Promise
allows JavaScript
to check for conditions and decide which function to execute - whether is the promise
is
resolved
or rejected
.
img1.callThisIfLoadedOrWhenLoaded(function() {
// loaded
}).orIfFailedCallThis(function() {
// failed
});
// and…
whenAllTheseHaveLoaded([img1, img2]).callThis(function() {
// all loaded
}).orIfSomeFailedCallThis(function() {
// one or more failed
});
How promise
could be use:
img1.ready().then(function() {
// loaded
}, function() {
// failed
});
// and…
Promise.all([img1.ready(), img2.ready()]).then(function() {
// all loaded
}, function() {
// one or more failed
});
Binding this
to JSX callbacks. Generally, if you refer to a method without ()
after
it, such as onClick={this.handleClick}
, you should bind that method: this.handleClick =
this.handleClick.bind(this);
- React Doc
To use state
and constructor
in React properly, must call
super(props)
to use this
in a constructor
.
What is the difference between state
and props
? My current understanding:
state
is used to show interactive state of React components, and props
, stands for
properties, is used to change the content of components.
P.S. started the new EXP system and introduced $0.5 and $0.25 hourly rates for creating and consuming respectively. I wonder if this would deter me from learning...? Well, the idea is to stop me from constantly looking at tutorials and not actually doing the work myself. It's like watching basketball tutorials without ever touching a basketball.
Import
and export
for React components are essential part of writing and
organizing React codes. Must stay organized on how components are interacting with each other.
this.props
is essential in passing information between React components.
Every component's pros
object has a proprty name children
.
this.props.children
will return everything in-between a component's opening and closing JSX
tags. This is a good way to insert content when content varies by component's instances.
Use getDefaultProps
property to display default message when property value is missing.
Naming convention for event handlers:
Continue on Codecademy React I. The most common use of props
is to pass information to a
component, from a different component. I will need to draw out a diagram to understand how
props
get passed between components, and how components export
and
import
.
Learn more about this
in JavaScript.
Getter
in JavaScript. Why use getter
? Getters
give you a way to
define a property of an object, but they do not calculate the property's value until it is
accessed. A getter
defers the cost of calculating the value until the value is needed, and if
it is never needed, you
never pay the cost.
The value is calculated the first time the getter
is called and is then cached so subsequent
accesses return the cached
value without recalculating it. This is useful in the following situations:
Continue on Codecademy. You can place logic in render function, but it must be within
render()
and before return
.
Only way to have if
statement inside React render function is before return
statement. - I thought you can't have conditional statements in React?! Need to circle back to clarify.
Example code to change component's attribute value using conditional statement.
Continue with Codecademy React Part I.
class TuxedoCat extends React.Component{
render(){
return(
//some code here
);
}
};
JavaScript classes are special functions, classes have expressions and declarations just like functions. Difference between JavaScript class and function is the order of declaring classes matter, but it doesn't matter for functions. Otherwise known as hoisting.
Why have classes? A cleaner way to have object-oriented design in JavaScipt. More on subclassing.
Subclassing React.Component
is the way to declare a new component class. Component class
variable names must begin with capital letters! class names are written in UpperCamelCase. In a JSX
element, that capitalized first letter says, “I will be a component instance and not an HTML tag.”
React components must have a render method, render() {}
, and value is a function. A render
method must contain a return
statement. Usually, this return
statement returns a
JSX expression.
React can work without JSX. Each JSX is secretly a call to React.createElement(component, props,
...children)
, and that's how compilers translate JSX to JavaScript.
It is possible to create shorthand for React.createElement if we get tired of typing it all the time:
const e = React.createElement;
ReactDOM.render(
e('div, null, 'Hello World'), document.getElementById('root')
);
The same can be done with document.getElementById
...
Use .map()
to work with arrays and lists in JSX. Learn more about .map()
Key
in JSX is like an id, but it doesn't get rendered. Key
is useful internally
by React to keep track of lists. Use keys
when:
Update gencats to use image search instead.
P.S.
Update gencats to have 34 kitties search.
Learning using if
statemetns in React in Codecademy. If
statement will not work
inside JSX, but will work as regular JavaScript. Alternative workaround is to have JSX inside
if
statements.
When
to use Ternary
, &&
and if
statement: Choose the more concise
version.
&&
and ternary
operators are more concise, choose either of these when
possible&&
over a ternary
when you want an action to occur (or not) based
on a single
condition. Example: if...then...ternary
for if...else... that returns a value. Example: if kitty, else puppy.if
/else
/else if
statement when you need to
extrapolate logic to make it easier to read and understandThe auto search script worked! Figured out how to automatically opening and closing search links. The issue with tabs opening at the same was solved by spacing timeouts for each subsequent searches. view script.
Tips on solving coding problems in the future: try to solve the problem the "dumb" way first. I tried to solve the problem with DRY method before I've figured out the solution, thus adding extra complications and confused myself - I felt like I was thinking in circles. And keyword is "thinking". I tried to solve the problem in my head, instead of just writing out the codes step by step.
Once I wrote the script step by step and did it the "dumb" way, I immediately figured out what the problem was. And then I can further refine the script by making it DRY.
View DemoWrite JavaScript program to automate opening and closing tabs. The intent is to open a new link tab, and automatically close the tab. And repeat through an array of links.
I've figured out opening one link and automiatically closing after 2 seconds. However, I cannot figure out how to loop this behavior through an array. The speed of opening is faster than closing, so I ended up opening a bunch new tabs and only closing one tab.
I will need to figure out how to call a function ONLY after the previous function is complete.
Continue learning React on Codecademy.
React
and ReactDOM
are different. React
is a JS library for
buildig UI, ReactDOM
is the JS library for React to interacte with DOM. You need to import
both into JavaScript file for React to work properly.{ }
.git checkout (name-of-branch)
git status
git add (file-name)
git add .
git commit -m "comment description"
git push origin (name-of-branch)
git merge master
Learning React on Codecademy. The React Tic-Tac-Toe tutorial was getting too confusing and I needed to start from scratch to understand every single details about React, rather than just jumping in to build an app without proper understanding of JSX, ReactDOM and Virtual DOM.
React on Codecademy
P.S. I'm also testing out VS Code to see how I like it, since Gatsby and Design.Code both used VS Code for React. I think I like an intergrated terminal in the code editor... but I don't know how to use the terminal to commit to my github yet. Once I figured this out, it'll make my life easier and just keep all of my coding activities within one app window.
P.P.S Since this code log is so repetitive and componenet-heavy, it'll be good to convert this website into React Components.
Go through React tutorial, Completing the Game, and getting confused. Main takeaway, have parent component change the state of the children components by passing props. Do not have parent asking for the children's state.
"To collect data from multiple children, or to have two child components communicate with each other, you need to declare the shared state in their parent component instead. The parent component can pass the state back down to the children by using props; this keeps the child components in sync with each other and with the parent component." - React
Set up React local development. Start tic-tac-toe game with React tutorial.
Learning resources: React for Designers
After spending sometime putting together the pages for HLC Plan Overview manually - literally putting in the html for every single page. I wonder if there are ways to automate it with templates. After some research, I came across static website, static website generator, and JAM (JavaScript, API and Markup)
JAM allows developers to focus on front-end development and not having to worry about server coding. And it's lightweight so I don't have to get bogged down by CMSs like Wordpress. Which is exactly what I need.
I browsed StaticGen for options. Since I'd like to continue using JavaScript and not learn any new languages to develop templates and automate my website pages, I've decided on learning and using Gatsby.
Gatsby uses React for its template, so I'll be learning React so I can be proficient enough to play with and customize Gatsby starters templates. I can't wait to start JAMing soon!
What is command line and why should I use it?
What is the Command Line? Command Line a simple, basic way to communicate with our computers. Our computers have evolved to use Graphic User Interface for users to communicate with computers - such as Window Explorers. GUI is intuitive and visual, and requires mostly mouse clicks. On the other hand, Command Line only uses keyboard and text.
Why should I use the Command Line? Command Line offers more ways to communicate with my computer through one channel, versus jumping through different locations and window explorers. For example, Git uses command line. What it does is that the Command Line has ALL control of Git, whereas if I use a GUI version, I'd have to install Github and uses Github's app to access different versions of Git. While Github is more intuitive, it doens't offer more power and control.
One example of how Github doesn't have more control is when I had to use different Github users.
Switching through Github is hard and confusing... and almost seems impossible. Just becasue I logged out
of Github doesn't mean my computer is unlinked from my previous Git source. So while my Github is saying
I've logged out of loys73
and is now using yishuenlo
, my computer's Git is still
linked to loys73
.
Apparently using command line is also easier to many batches of files, such as changing file names just for .txt file. In summary, Command Line is the most rudimentary way to communicate with computers, but also the easier way to control and let communters understand what we need from them. Almost like comparing 文言文 and 白話文.
Free Code Camp JavaScript exercise: replace loops using recursion. Write a function that will continually add to itself, until it reaches 0. For example, 5+4+3+2+1.
I don't think I've understand the concept enough to explain why... and I don't understand why I must learn it - how is it relevant to building pratical websites, if I don't want to do fractal math?
This website I found helped explain what is recursion... that supplement Free Code Camp.
Review static sites. Read Gatsby.js documentation and tutorials on how to set up static site with Gatsby. Will need to learn React.js to customize the starter pages.
The goal is to transfer this simple site to Gatsby. Which would require me learning React.js...
Mocking up / styling HLC plan overview content pages.
Added JavaScript and toggle interaction works. However, due to different z-index for header navbar and hamburger menu, they create another issue. The expanded hamburger menu should cover up everything, including the header, but hamburger icon is inside the header. Therefoe, it's either the whole menu covers everything up, including the hamburger icon. Or hamburger icon is showing, but header is also on top of expanded menu.
Potential solution:
header
, and into nav
.Decided to go with option 2 and hide header when clicking on hamburger icon. So the changes are just within CSS and JavaScript, and no need to shuffle the structure in HTML.
Next step: add navigation at the footer.
Added hamburger icon to top navbar.
Next steps:
Style menu in smaller screen mode.
Next steps:
Fixed width jump as menu turns sticky by making nav position fixed as soon as it hits screen with break.
Fixed content width overlapping with fixed menu. Now running to problem when menu turns sticky, and
changed position
to fixed
. Thus resulting in it escaping normal document flow
and expanded content width. There is a noticeable width jump as sticky is applied, even when menu is
hidden in tablet view.
Refine HLC overview sticky menu. Use media query
to assign hamburger menu codes to sticky
menu. Found bug that when menu turns into sticky, the main
content overlaps with the menu.
Will need to adjust position
and width
of content to resolve this issue.
For now, the menu will disppear when it hits designated media query
width.
Finish mockup practice. Refine code to refine visual design.
View DemoLearning to build hamburger menu based on a demo. view code here.
View DemoMockup raw html elements for Adobe Illustrator Area Converter app.
Further refine design for illustrator area converter in Adobe Experience Designer. Should have a decent design to start mocking up in HTML and CSS.
View DesignDesign area caculation conversion for Adobe Illustrator. Research design inspirations on Dribbble.
Refine HLC website design. Need to figure out how to best layout Tools for Transformation article. I'm still not quite satisfied with the design.
Write JavaScript to calculate parcel areas from pixel in Adobe Illustrator to acres. Calculate 9 parcels area for two different alternatives.
Create arrays to store parcel names and parcel areas, and used console.log to display acreage for each parcel.
Note: may create simple apps to calculate Illustrator area convertions, such as pixel to SF or acres, and account for different scales for the drawings.
Refine tools article. I'm not satisfied with the current design and will need to do more precedent research and deisgn iterations.
Work on a minimum viable product for the plan overview: instead of building out ALL the animation and interaction details, start with a static functional website first, and slowly layer in the interactions.
Optimize hero image layers so it loads faster on the web, and no lag time when launching the website.
Lay out CSS grid
for the tools for transformation.
Based on viewing from the inspector for gardenestudio, I can see:
data-v
changes from 0 to 1 as I scroll from top to dowon. It seems data-v
controlls the length of these vector lines.path
tag, there is a style: "stroke-dasharray"
assigned
to it. And stroke-dasharray
has to number that changes values as I scroll.svg
tag has classes changing from skrollable-before
to
skrollable-between
, as I scroll through the page.Challenges: I can't find the CSS for these classes... will need to dig around to find them.
Turn fixed navbar into sticky navbar. Move nav
to the same div
as main content,
and use main content's offsetTop
property to figure out when to apply sticky
class to nav
.
Made header fixed, so it has a visible button for the full plan throughout the website. The button is readily available for people who would want to see the full plan pdf, and addressed concern for using website vs pdf for planning documents. Fixed sticky navbar to accommodate the extra header height.
Fine tuned parallax animation, and make the layers movement more apparent.
Refine objective article: pulled out each objective into its own row, and add descriptions and learn more buttons to help direct users to objective pages.
Next step: apply animation to objective icons, much like the svg animation for this website
Looking for precedents to display the fixed menu. Figured out what I was looking for is called Sticky Navbar. The idea is to allow navbar to scoll naturally, once it hits a certain point, it will stay fixed (aka stick) in its location.
ExampleAdded new div
for impact statement a way to cap the end of the parallax overlapping images,
and allow fixed navbar
to display along main content.
Fixed parallax layers so they're displaying properly without extra overlaps. Fixes include:
z-index
to articles, so main content is above parallax and cover up the
overlaps. Issues: fixed
table of content is now beneath everything, since it doesn' have
z-index
assigned. In other words, TOC needs to be below hero article, but on top of main
contents. But main content needs to be above of hero article. Will need to find alternative to fix
z-index
issue. Possible solution could be adding another article that's above hero, but below
main.
Adjust image sizes. Change background-size
to cover to stretch the image to fit the screen.
Test parallax effects on the layers. Run into problem with overlaping background and due to the images moving at different speed, they overlap at the bottom. Will need to cover up the bottom with another article. Also needed a new layer for the foreground grasses to make parallax effects more noticeable.
Will need to find ways to integrate HLCC logo in the hero image article.
Lesson learned: cannot have repeating elements in any layers. Each layer must have its own graphic.
Start a div article to place parallax layers using CSS background-image
. Adjust height,
width, and alignment to display image with ideal crop.
Explode hero image into 5 layers in Photoshop for parallax effects.
Note: used existing image of HLC. Had to patch up background images when "peeling" off the top layers. Consider compiling layers from scratch for a cleaner look in the future.
Mock up landing page for the Plan Overview
View MockupStudy parallax image at FireWatch. Main takeaways:
div
, and place each layer as a div
under the
containerdiv
, foreground at the last div
background-image
to load each image layer in CSSdata-
attribute
for scrolling speed, so JavaScipt can control the translation as mouse scrollsdata-speed
attributenote: will need to find a good image for parallax layers. And design the landing page for The Plan for the HLC.
Build a parallax page using cat photos. Need to have a deeper understanding of CSS's
position
.
Started building a parallax demo based on this web page.
Study the basics of creating parallax using CSS.
Main takeaway: use background
properties to create parallax effects.
background-attachment
is the backbone of parallax effect. Use fixed
to make
background fixed relative to hte viewpoert, so it doesn't move with other elements.
background-attachment: fixed;
background-position: center;
background-repeat: no-repeat;
background-size: cover;
Use min-height
to set a specific height for background image. Must add enough content, aka
enough height to the next article, for scrolling effects to be apparent.
Refine and modify paint page. Instead of just having article, added img to test out styling img tag.
Applied object-fit:cover
to avoid stretching images. Will need to figure out how to design
paint page to record progress and still keep design simple and minimal. Next step is to make the page
responsive with different image sizes.
Mock up paint page with CSS grid. Will need to research CSS grid more for layout options.
Add button to view JavaScript project on JS Bin. Style button in CSS.
Continue refine webite's CSS. Make website responsive. Added about page.
Design and build minimalist website to log my coding journey towards a macbook - the website you are looking at right now :)
Developed style and html pages for code and process. Today's coding definitely took more than 10 minutes. More like 4 hours ish... and I'm still on level 2, so $1 for me. yay. The most important thing is to consistently show up and today is just a very good day.
Write JavaScript to allow calculation functions to run immediately after input, so users do not need to press enter or click on another button to convert the temperature.
Used setTimeout
to delay running calculation functions after a keyup
addEventListener
is triggered on <input>
.
Write CSS to design display. Align inputs and labels to the center using flex
. Tried out all
of flex's "align" options and found out align items
is what I was
looking for.
align-item
- controls alignment of all items on the cross axis.align-self
- controls alignment of an individual flex item on the cross axis.align-content
- described in the spec as for “packing flex lines”; controls space between
flex lines on the cross axis.Write HTML structure for problem title, descriptions and input forms and labels.
Return back to coding after months of hiatus. Continue working on my 150 JavaScript Basic Project #12: Temperature Converter, and wrote JavaScript functions to convert Celsius to Fahrenheit, and vice versa.


Final project proposals
- Use NetworkX to create a complete weighted graph K_n
for n random points in the plane.
The edge weights are the distances between points.
Find the minimum spanning tree.
Plot the MST using Matplotlib.
https://en.wikipedia.org/wiki/Minimum_spanning_tree
- Use NetworkX to create a complete weighted graph K_n
for n random points in the plane.
The edge weights are the distances between points.
Solve the travelling salesman problem using any heuristic algorithm
(nearest neighbor, sorted edge).
Plot the solution using Matplotlib.
https://en.wikipedia.org/wiki/Travelling_salesman_problem
- Use NetworkX to create a complete weighted graph K_n
for n random points in the plane.
The edge weights are the distances between points.
Use Kruskal's algorithm for cluster analysis.
Plot clusters using Matplotlib.
https://en.wikipedia.org/wiki/Cluster_analysis
- Use pandas to create a database with books, films or songs
(use a single type of items in a single table).
Required operations: list, insert, remove, search.
The database should be saved to a text file (JSON or CSV).
- Create a game tic-tac-toe with a Tkinter GUI (user vs computer).
Save game results to a log file.
https://en.wikipedia.org/wiki/Tic-tac-toe
- Create a game Battleship with a Tkinter GUI (user vs computer).
Save game results to a log file.
https://en.wikipedia.org/wiki/Battleship_(game)
- Download data on fluel prices (Orlen), currency rates, etc.
Show time dependence using Matplotlib.
- Implement a maze generation algorithm.
Show the result on the console or as an image.
https://en.wikipedia.org/wiki/Maze_generation_algorithm
- Generate the Mandelbrot set.
Show the result using Matplotlib or Tkinter Canvas.
https://en.wikipedia.org/wiki/Mandelbrot_set


TheChaosKings
Multi-Stream
Members
It looks like we lost this page. I'll let the Kings know. We will quest for this page in you're honor!


About
Projects
Contact
Hiya
, I'm Ellis.
Developer, Designer, Writer.
Get in touch
Front-end and UX Projects coming late 2021!
Current projects
Front-end
JavaScript
UX Design
Mobile app for a fictional cinema company (Google UX Design Professional Certificate project)
Portfolio Project 1
Portfolio Project 2
Portfolio Project 3
Portfolio Project 4
Get in touch
Feel free to message anytime
Email
FCC Profile
LinkedIn
This is just a practice webpage and not a real portfolio.
Created by Ellis Warren 2021


Quick Tips
- Type "te2en" in Windows Run to start application
- When minimized, application will be minimized to tray. To restore, double click
on tray icon
- To type in telugu, press F2 and start typing in text box to have telugu text
displayed next to it
- Set default typing language from Options menu


An example of my freelance web development and design work. Designed and built virtual space for Parallel _ for Thinking, a collective focused on creating a more creative, conceptual discussion around architecture, art and technology.
An example of my freelance web development and design work. Designed and built virtual space for Parallel _ for Thinking, a collective focused on creating a more creative, conceptual discussion around architecture, art and technology.


Hello World!, we are software developers!
Customer Service Survey Form
tell us about your customer experience with Mcdonalds filling in the following survey
Name:
Email:
Age:
Country:
Mexico
Guatemala
Gender:
male
female
other
Income:
less than 1000/ year
more than 1000/year
Enter additional comments:


Corbet Lamkin, Ph.D.
- Chancellor of Southern Arkansas University Tech in Camden, AR.
- Professor of Agricultural Economics and VP of Academic Affairs, Southern Arkansas University, Magnolia, AR.
Cass Kurzinski
- Special Projects Director
- Chemical and Metallurgical Engineer with 40+ years of experience in the design, fabrication, installation, and operation of steel plants, chemical plants, etc.
Donald Richardson
- President of SolaRid
- 40+ year career with on-the-ground conservation and agriculture policy, environmental advocacy, and politics.
Randy J. Sasaki
- CEO of SolaRid
- 18+ years of experience as a managing partner in an investment fund conducting due diligence, financing R&D, commercialization, and global distribution of several commercial products.
Philip Serafini
- Principal scientist for the International Crops Institute for the Semi-Arid Tropics (ICRISAT) in West Africa, 11 years.
- Developed and managed 4,200 ha for commercial agriculture.