TIL About Array.prototype.fill (Javascript)
Today I learned about Array.prototype.fill and friends.
You can use the method to fill an array with values, or create a new array filled with values.
Pitfall: if you fill a new array with a value that is an object, each slot in the array will reference that object.
const newArr = Array(4).fill([]) > [[], [], [], []] newArr[1].push(8) > 1 newArr > [[8], [8], [8], [8]] Further Reading MDN: Array.
My Udemy Course Recommendations (2020)
I’ve learned lots of useful concepts and techniques from courses on Udemy. Most of my programming education stems from free resources like Udemy, Coursera, or edx.
Udemy courses are very cheap. The platform often runs sales around USD $10.
The course quality differs. You will get everything from crappy material to incredible lessons that will teach you invaluable skills.
I’ve completed dozens of courses. Tutorial hell is real.
Remember to put in the work and practice a lot.
Reduce Input
I’ve been thinking today on how to improve my workflow.
At the moment, coding is purely a side-project for me. I have a day job as a tax officer and two young kids.
I love programming and learning new concepts, but I have a limited amount of time that I can spend on coding.
There are tons interesting aspects, programming languages, frameworks and concepts that I would love to explore.
Friday Picks 049
Here are some links for this Friday:
Architecture Patterns with Python: Enabling Test-Driven Development, Domain-Driven Design, and Event-Driven Microservices Paperback - learn Domain-Driven Design with Python, free HTML version Performance Best Practices: Running and Monitoring Express.js in Production - insightful article, although it boasts some ads for the service the blog belongs to How To Build An Amazing LinkedIn Profile [15+ proven tips] - a guide on getting the most out of your LinkedIn profile Nonsense!
Algorithms in Lisp and Python in Lisp
You can get two Lisp-related books for free on Leanpub:
Lisp Hackers Programming Algorithms There’s also a book on the Hy Programming language, a Lisp-like syntax alternative for Python.
The book A Lisp Programmer Living in Python-Land: The Hy Programming Language is not free, but available for a minimum price of $ 5.00.
It contains some practical projects for Hy, for example, web-scraping with the library Beautiful Soup, or Deep Learning with Keras and Tensorflow.
How to Ask for (Coding) Help
Lately, I’ve been very active on the ZeroToMastery Discord channel.
The channel is one of the meeting places for the popular coding courses.
Many people are beginners.
But that’s what the community is for: to provide a place to ask for help and to connect to other students and the teachers.
When it comes to asking for help with coding challenges, many people are either unable to properly debug and pin-point a problem, or they are unable to communicate their problem.
What’s Up in May 2020
I finished the implementation for fastify-bookmarkly, a Node.js REST API using the Fastify framework and a clean architecture style. The repo is a port of Bill Sourour’s clean Node.js microservice repository.
I’m still learning Flutter.
I’m trying to wrap my head around how to implement a clean architecture/hexagonal architecture with TypeScript.
For a Java implementation, see this repo from Tom Hombergs, author of Get Your Hands Dirty on Clean Architecture.
Awesome Flutter
Updated on June 8, 2020.
In the last week, I’ve started digging into Flutter.
Why?
I’m not interested in learning yet another platform/language. Dart (the language for Flutter) is easy to pick up, and Flutter looks like a promising choice for cross-platform mobile development.
But I’m much more keen on learning about clean architecture and hexogonal architecture patterns.
A few days ago I stumbled over ResoCoder‘s blog and tutorial series on clean architecture in Flutter:
Some More Resources for Clean Architecture
Besides the obvious (the material by Robert C. Martin), what are some other good resources for learning about clean architecture? I found that this talk by Ian Cooper overs a good overview:
If you want something that you can apply to TypeScript, you might want to check out the SOLID book by Khalil Stemmer. You can also check out his blog, for example, the article about Comparison of Domain-Driven Design and Clean Architecture Concepts.
Learning Flutter and Clean Architecture
At the moment I’m diving into clean architecture. I’m trying to find practical resources on how to implement such an architecture. You can find a course on Clean Architecture and TDD with Flutter on YouTube.
If you’re interested in Flutter, you can get a free introductory course on Appbrewery. And from April 13 to April 17, 2020, you can also watch free talks by Flutter experts. Further Reading Introduction to Flutter Development Using Dart by Appbrewery The Clean Architecture by Robert C.
Currently Working on Clean Nodejs With Mongodb and Graphql API
At the moment, I’m into architecture, clean code, building APIs.
I’ve watched the video Using Clean Architecture for Microservice APIs in Node.js with MongoDB and Express by Bill Sourour.
I’m trying to build something similar, but using the Fastify framework and GraphQL.
Bill works a lot with dependency injection, and I’m having trouble with translating the code from using http endpoints and requests to using GraphQL.
Further Reading Example Microservice API by Bill Sourour Using Clean Architecture for Microservice APIs in Node.
Resources for Learning Nest.js
Here are some resources for learning Nest.js, the TypeScript Node.js framework with Angular-like architecture.
Recommended resources are bold.
Awesome Nestjs: a massive list of NestJS resources API with NestJS - a tutorial series in blog format Learn NestJS - Full Course for Beginners: YouTube/Udemy by Dawid Dominiak Learn Nest.js from Scratch by building an API by Maximilian Schwarzmüller Nest.js with MongoDB - Complete Example by Maximilan Schwarzmüller NestJS Crash Course by Brad Traversy Build a GraphQL Server with NestJS and MongoDB by Ben Awad NestJS Zero to Hero - Modern TypeScript Back-end Development by Ariel Weinberger (paid course) Creating your first Node.
A Walkthrough of the “Complete Machine Learning and Data Science Zero to Mastery” Course (Part 08)
I’m going through the Udemy course Complete Machine Learning and Data Science: Zero to Mastery and writing down my observations/lecture notes.
This is the eigth part of the blog post series.
part 1 part 2 part 3 part 4 part 5 part 6 part 7 TL;DR (A Review of The Complete Course) The program is a praise-worthy introduction to data science and machine learning with Python. The instructors focus on practical skills and convey an enormous topic in a captivating and friendly way.
A Walkthrough of the “Complete Machine Learning and Data Science Zero to Mastery” Course (Part 07)
I’m going through the Udemy course Complete Machine Learning and Data Science: Zero to Mastery and writing down my observations/lecture notes.
This is the seventh part of the blog post series.
part 1 part 2 part 3 part 4 part 5 part 6 part 8 13. Data Engineering These lectures cover what kind of data we have (structured data, unstructured data, etc.).
How can we make the raw data consumable for machine learning libraries?
More Learning Resources During COVID-19-Outbreak
Here are some more resources for learning new things during self-isolation:
Education Links: a collection of links to help you and your kids Amazing Educational Resources: a list of resources with free or discounted offers OpenLearn (free learning platform from the Open University) Scholarships for Students on Codecademy: 10,000 free accounts for high-schoolers and college students around the world Shawn Wildermuth’s Courses: free courses on Bootstrap 4, Vue, SignalR during the crisis Free JavaScript/Node/CSS books 365 Data Science: Free Access Till April 15th: learn mathematics, statistics, SQL, Python, machine learning 50% discount on Wes Bos’s courses: Wes Bos is a respected JavaScript teacher 50% discount on dataquest.
A Walkthrough of the “Complete Machine Learning and Data Science Zero to Mastery” Course (Part 06)
I’m going through the Udemy course Complete Machine Learning and Data Science: Zero to Mastery and writing down my observations/lecture notes.
This is the sixth part of the blog post series.
part 1 part 2 part 3 part 4 part 5 part 7 part 8 10. Milestone Project 1 In this project we work through a dataset from start to finish. We use supervised machine learning to gain insight into a classification problem.
A Walkthrough of the “Complete Machine Learning and Data Science Zero to Mastery” Course (Part 05)
I’m going through the Udemy course Complete Machine Learning and Data Science: Zero to Mastery and writing down my observations/lecture notes.
This is the fifth part of the blog post series.
part 1 part 2 part 3 part 4 part 6 part 7 part 8 9. Scikit-Learn Up until now, we’ve learned how to consume data and make fancy diagrams.
The current section finally deals with Machine Learning and teaches you the basics of Scikit-learn.
“Learning to Learn Effectively” by Jovica Ilic
This blog post shows my notes from the PDF “Learning to Learn Effectively“ by Jovica Ilic.
The PDF is a bonus for the Mastering Vim Quickly product. The document clocks in at 19 pages and is a quick read with some learning tips.
I only recorded the essential key takeaways:
Mindset strive for change Motivation mini-habits measure everything track progress visually Learning Principles learning is learnable take care of yourself (hydrate, breaks, concentration spans, sleep) teach someone else change your mindset (expect to replay it back) expect to teach it (or write about it in a blog post without checking out the original learning resource) identify gaps in your knowledge implement right away (take action): “Which three things can I learn and put into action right away?
“Learning to Learn [Efficient Learning]: Zero to Mastery” - Course Review and Notes
In this blog post, I’ll post my notes and thoughts about the course “Learning to Learn [Efficient Learning]: Zero to Mastery.” (Udemy Link).
The course has four main sections: Principles, Pillars, Lies, and Techniques.
The Principles The section establishes some useful principles for motivated self-learners.
Learning vs. Winning The System shift from trying to win the game (get good grades, get a promotion) to a mindset of long-term learning (see “The Lesson to Unlearn” by Paul Graham) define your measure of success you need drive and persistence embrace the obstacle: you’ll be bad first until you get good know when to quit, make a smart choice (not everyone can become an Olympic athlete) compound learning: learn in chunks instead of cramming improve by 1% every day failures don’t count against you: people know you right now, they don’t care about the test you failed five years ago use failure as a feedback loop mindset: choice vs.
A Walkthrough of the “Complete Machine Learning and Data Science Zero to Mastery” Course (Part 04)
I’m going through the Udemy course Complete Machine Learning and Data Science: Zero to Mastery and writing down my observations/lecture notes.
This is the fourth part of the blog post series.
part 1 part 2 part 3 part 5 part 6 part 7 part 8 7. NumPy The section covers an introduction into NumPy.
NumPy will covert any data into a series of numbers. NumPy is the backbone of all data-science in Python.
Learning Progress: Starting Nand2tetris
I like to learn with project-based courses. The practical approach works well for me. It helps me stay motivated. I also like to work on something tangible.
That’s why I’m glad that I found the nand2tetris course.
The course has a website that contains all the lectures, slides, and exercises.
You can buy a book for the course, or you can attend a Coursera course (audit for free).
nand2tetris helps you to build a general-purpose computer system from the ground up.
TIL: How to Run Your Scripts From Everywhere
I’ve been writing a few bash scripts and some Nim command line utilities.
You can run a script from the folder which contains the script. Here’s an example file structure:
~/bin/ ├── git-reset-author.sh └── readme_template When I’m inside the ~/bin directory, I can type into the terminal: readme_template.
But what if I want to navigate to a different folder on my machine and run the script from that location?
fish: unknown command readme_template The shell doesn’t find the program.
A Walkthrough of the “Complete Machine Learning and Data Science Zero to Mastery” Course (Part 03)
I’m going through the Udemy course Complete Machine Learning and Data Science: Zero to Mastery and writing down my observations/lecture notes.
This is the third part of the blog post series.
part 1 part 2 part 4 part 5 part 6 part 7 part 8 4. The 2 Paths The class aims to be beginner-friendly. Now you have the choice to learn how to program in Python or to continue with the default route.
A Walkthrough of the “Complete Machine Learning and Data Science Zero to Mastery” Course (Part 02)
I’m going through the Udemy course Complete Machine Learning and Data Science: Zero to Mastery and writing down my observations/lecture notes.
This is the second part of the blog post series.
part 1 part 3 part 4 part 5 part 6 part 7 part 8 3. Machine Learning and Data Science Framework The course focusses on learning by doing. Instead of learning higher mathematics and over-thinking the process, the instructors show you a framework that encourages a fast feedback loop.
A Walkthrough of the “Complete Machine Learning and Data Science: Zero to Mastery” Course (Part 01)
I’m going through the Udemy course Complete Machine Learning and Data Science: Zero to Mastery.
The course runs under the flag of Andrei Neagoie. Andrei is a popular instructor on Udemy, with almost 200.000 students, and top reviews.
For this course, he has paired up with Daniel Bourke, a self-taught Machine Learning Engineer from Australia.
In this blog post series, I will jot down my thoughts on the course, and what I’ve learned.
Nim First Impressions
I’ve started dabbling in Nim some days ago.
My experience level: I’m a self-taught hobby developer. No professional experience, but a lot of enthusiasm.
I’ve created some toy applications, but nothing production-grade.
I’m most familiar with JavaScript and React.js, but also know a bit of Clojure, Elixir, Python, and Reason.
What is Nim? From the Nim website:
Efficient, expressive, elegant
Nim is a statically typed compiled systems programming language. It combines successful concepts from mature languages like Python, Ada and Modula.
Reading “Nim in Action”
I’m currently working through the excellent book Nim in Action by Dominik Picheta.
Nim looks like a promising and fresh language:
Nim is a statically typed compiled systems programming language. It combines successful concepts from mature languages like Python, Ada and Modula.
What I like about Nim is that it looks like Python, but it compiles to a dependency-free executable (C, C++, or JavaScript).
The language is fairly small, but it allows for writing macros (meta-programming) like a Lisp.
AWS ECS - I’m Giving Up
The last fews day’s I’ve been learning how to deploy a Flask and React application to AWS.
I’ve decided to shelf that project for now. As a hobby developer and learner I don’t need all the features that AWS offers.
A setup with Load Balancer, RDS instances, etc. adds a lot of complexity which I have no use for.
The plan for this month was to create a test-driven Python and React application.
Kids and Not a Lot of Sleep
Today I didn’t get a lot of “work” done.
My daughter woke me up a few times this night, so I only got a couple hours of sleep.
Pair that with having a day job, and there’s not a lot of energy left for doing tasks that require some concentration.
In my spare moments, I keep up with articles about programming.
For example, I found this React book by Chris Noring today.
Friday Picks 027
Here are some reads I found this week:
A Pattern For Cancelling Fetch API Requests - how to cancel fetch Create a user controlled dark or light mode - design accessible dark and light modes for your website Computer Architecture - Fall 2019 Course - free YouTube lectures from ETH Zürich Commit Message Driven Development - you might have heard of README Driven-Development, but what is Commit Message Driven Development?
First Thoughts About ReasonML vs TypeScript
Today I finished my first TypeScript experiment with React.
Here are some thoughts after using ReasonReact first, and now TypeScript second.
Setup Is Not Better Than ReasonReact
I used Create React App to bootstrap the app.
npx create-react-app <project-name> –typescript But then I had to setup ESLint and Prettier with TypeScript.
ReasonML & BuckleScript:
npm install -g bs-platform bsb -init <project-name> -theme react-hooks After that you’re done.
It’s JavaScript
Preparing For My First Tech Talk: TypeScript Experiments
A few days ago I started preparing for my first tech talk.
One of the common questions about ReasonML and ReasonReact is: Why not TypeScript?
If you’re looking for a statically typed alternative for JavaScript, TypeScript seems like the obvious choice.
I did a TypeScript workshop with FrontEnd Masters (online) a while ago, but I have to admit that I didn’t use TypeScript in practice.
The last few days I started creating a simple TypeScript React app.
Check For Equality in Reason vs JavaScript
Reason and JavaScript are not the same languages, although the syntax looks similar.
That’s intentional, but sometimes hides fundamental differences of those languages.
Comparing values is a common task in programming. Let’s look at the equality operators.
Checking For Equality in JavaScript Here’s what MDN has to say:
Equality (==) The equality operator converts the operands if they are not of the same type, then applies strict comparison. If both operands are objects, then JavaScript compares internal references which are equal when operands refer to the same object in memory.
Preparing For My First Tech Talk
I’m not sure how it happened. But a while ago, I agreed to hold a tech talk. 😱
Today, I was able to prepare for the talk. I woefully underestimated the amount of work!
I now have a new appreciation for all the speakers.
Tools I decided to use Remark.js to create slides from a Markdown file. With the CLI tool backslide you can easily automate the process.
I found it painless to create decent-looking slides with minimal effort.
How To Learn OCaml
A starting point for learning OCaml - a functional, type-safe, expressive, and battle-proven language
Why OCaml? OCaml is an open-source functional, statically typed, and mature language. If you want to learn such a paradigm, OCaml is far more beginner-friendly than Haskell.
OCaml has a blazingly fast compiler and excellent type inference. It offers exhaustive pattern-matching, which makes your programs concise and a joy to work with.
I’ve come to OCaml from ReasonML, a JavaScript-like syntax, and tool-chain for OCaml.
Free Functional Programming Course With OCaml
Today I discovered a free MOOC for Functional Programming in OCaml.
The course is offered by a French platform, FUN-MOOC.
You can attend Introduction to Functional Programming in OCaml for free (after you sign up for an account).
The course is in English and runs for a few weeks until end of December 2019.
I am interested in learning more about OCaml after programming a few simple applications in ReasonML. Reason is an alternative syntax for OCaml, and I’ve come to appreciate its type-safety and programming paradigms.
Minimal Vim
Yesterday I trimmed down my vimrc - the configuration file for Vim.
I admit that I can’t live without some plugins.
So a “minimal Vim” is probably not possible for me.
But if you’re interested, here is a good start:
" Suggested Minimal Settings For Programming " Enabling filetype support provides filetype-specific indenting, " syntax highlighting, omni-completion and other useful settings. filetype plugin indent on syntax on "
matchit.vim is built-in so let's enable it!Personal Knowledge Base with Vimwiki
What is VimWiki? VimWiki is a personal wiki for Vim. Thus, it’s ideal for a personal knowledge base.
With VimWiki you can:
Organize notes and ideas Manage to-do lists Write documentation Maintain a diary Export everything to HTML We can use VimWiki as a powerful note-taking tool, which integrates well with an existing coding workflow in Vim/NeoVim.
How? Install VimWiki with your favorite package manager.
For example, with minpac:
Every Layout In CSS
I’m trying to learn CSS.
You might experience the same problem: you know CSS basics, but you can’t create a website with your fragmented skills.
I found a resource that could help with that: Every Layout.
The website teaches you basic CSS building blocks from which you can create your layout. That makes sense to me.
I find it more logical than adding a lot of individual utility classes to CSS (like Tailwind.
Learning ReasonReact Step by Step Part: 10
Here are some reflections on my path to creating a first ReasonReact application.
ReasonReact is still React
ReasonReact’s API stays as close as possible to React. As you know, ReasonML is a syntax and build chain for OCaml, but it compiles to JavaScript (and React.js).
You can use your previous knowledge of building React applications. However, ReasonReact ships with the underlying assumptions of React and React hooks: one-way data binding, handling derived state or synchronizing state, the complexities of life-cycle management, useEffect, etc.
A Look Back At Tech MeetUps And Ruhr.js
I’ve attended several local meetups this year. Being new to tech can be daunting because you don’t know anyone, and you might feel that you don’t fit in.
As a woman, it can also be intimidating because you might be the only woman present. I’m pretty extrovert in such situations, so it was never a problem for me. But I can understand if others might feel uncomfortable.
(I never experienced prejudices or sexism at meetups, though, I was always on equal footing with other attendees.
A Look Back At My Programming Journey So Far
Last weekend I attended my first tech conference: Ruhr.js 2019 in Bochum, Germany. Milestone reached!
I will write about my impressions tomorrow.
My Coding Journey I’m a self-taught developer who decided one day (on a whim) to learn how to program.
I started with HTML, CSS, and JavaScript with Freecodecamp.
Soon I realized that I didn’t have a clue on how to design programs, how to come up with a concept and make it happen as a web application.
Beginner Error with (Reason)React And Updating State
A few weeks ago, I started learning ReasonML and ReasonReact.
After doing a basic tutorial, I decided to tackle a form with validation.
Building a simple form is not too hard, but it offers some interesting challenges. Some examples include getting user input and storing it locally, adding validation logic, and displaying the validation messages.
Thus Reason Form was born.
It takes inspiration from James King’s Using Custom React Hooks to Simplify Forms and a (deprecated) course about TDD with React, Flask, and Docker.
Working On Stale State And Hooks
Learning the fundamentals of React was reasonably straightforward.
React.js adds a lot of abstraction over JavaScript. But after you’ve got the basic building blocks down, you can get quite far.
You can profit from the vast ecosystem, and the tons of available material (tutorials, StackOverflow, blog posts, etc.).
But the more you work with state, props, you realize that there are a lot of pitfalls.
You probably don’t need derived state, but sometimes you do.
State Management is Hard
State management in React.js and ReasonReact proves to be challenging.
I have two pieces of state with useReducer, which I can’t get synchronized.
Another problem is to conditionally setup useReducer depending on a prop. It probably results from a limitation of ReasonReact because Reason is stricter than JavaScript.
It keeps being exciting to learn new things.
Addendum: Kent C. Dodds wrote an excellent blog post about this topic today: Don’t Sync State.
ReasonReact is Still React
The problem with ReasonReact is - it’s still React.
(No kidding.)
Today I tried fixing a bug in my ReasonReact form app.
After some debugging, I realized that I have a problem with derived state which I receive from a custom hook.
I now have to find out how to best synchronize my state.
The good thing about ReasonReact is - it’s still React. Easily search for solutions, and utilize your previous React knowledge.
Never Give Up
A few days ago I was on the verge of giving up ReasonML.
Learning ReasonReact is quite challenging.
But I’m glad that I stuck with it. I quite enjoy the type system after some initial hiccups.
The ReasonML Discord channel was a big help. There are some neat patterns you can do with ReasonML (think: pattern-matching, option type, immutability, etc.)
The community is very friendly, and there’s always someone who’s willing to lend a helping hand.
ReasonML Development With Vim
Vim is my favorite editor, and I prefer it over VS Code.
(Neo)Vim offers a light-weight, fast experience where I can quickly navigate via keyboard shortcuts and use the terminal to its fullest.
Reason offers superb editor support for Vim.
From the vim-reason-plus README:
To have the complete Vim/Neovim Reason experience, there are two plugins to install: [vim-reason-plus], and the language-server.
[vim-reason-plus] provides syntax highlight, snippets for Reason and allows related features to recognize the Reason syntax.
Learning ReasonReact Step by Step Part: 2
By now we have the HTML/JSX skeleton for our input form: a simple login form styled with Bulma.
(The code is available on Github.)
Stumbling Blocks With ReasonReact The idea for this blog post series was to create a ReasonReact form with hooks to learn how ReasonML and ReasonReact work.
I took inspiration from James King’s tutorial on Using Custom React Hooks to Simplify Forms. When I read it at the beginning of the year, it helped me to understand how the new React Hooks API works.
Learning ReasonReact Step by Step: First Thoughts
The last few days, I’ve spent a lot of time learning ReasonReact. It has been a frustratingexperience so far.
Even simple tasks like creating forms prove to be quite hard for me.
I’m quite familiar with React. Of course, I’m no expert by far. But I can use the new Hooks API, useReducer, useContext, etc.
With ReasonReact, even easy tasks get more complicated.
You have to learn how to use the type system with the ReasonReact API.
Going to RuhrJS
I’m so excited! I will be attending my first tech conference in October!
Today I got my tickets for RuhrJS, a JavaScript conference in the Ruhr area.
I’m one of the volunteers, and I’m looking forward to that, too.
This is all new to me, but I couldn’t be happier!
I’m glad that I attended local tech meetups. I met one of the organizers, Madeleine Neumann at a JavaScript meetup.
Friday Picks 016
Today the “Friday Picks” are a day late. Sorry.
Problem Solving and Clojure 1.9 Podcast transcript - Rich Hickey, creator of Clojure, talks about problem solving - worth a read, even if you’re not interested in Clojure Jest Tutorial for Beginners: Getting Started With Jest for JavaScript Testing (2019) by Valentino Gagliardi Web Development Simplified With Svelte by Mark Volkmann - excellent in-depth introduction into Svelte.js Docker series - learn Docker from the beginning, in the Cloud, microservices etc.
NeoVim and LanguageClient for Elixir
Yesterday I installed LanguageClient-neovim for NeoVim.
This tool adds Language Server Protocol support for NeoVim (or Vim8).
It helps with autocompletion, code formatting, code definitions, and offers other features as well.
LanguageClient-neovim Installation With minpac:
call minpac#add(‘autozimu/LanguageClient-neovim’, {‘rev’: ‘next’, ‘do’: ‘!bash install.sh’}) In Neovim, run the following command afterwards:
:UpdateRemotePlugins elixir-ls Installation You have to install a language server for each language you want to support and then configure the plugin.
React Render Props and Svelte Slots
I’m trying to wrap my head around React‘s render props and Svelte‘s slots.
Not much to write here, I still try to understand how it works.
State Management in SPAs is quite complicated.
There are a lot of solutions: passing props down, the Context API, the new useContext hook, state management libraries like Redux or MobX, state machines, etc.
But you can also use component composition by rendering the children props.
Learning About React Context
I’m expanding my React knowledge so that I can build better apps.
One of my learning resources is the Udemy course Complete React Developer in 2019 (w/ Redux, Hooks, GraphQL).
I’ve been familiar with the basic setup of React’s Context API. But there are some nuances, of course.
Below are some blog posts to get you started on the topic.
Further Reading How the useContext Hook Works by Dave Ceddia Redux vs.
Git: Use Different Email Addresses And Keep Them Private
Both GitLab and GitHub allow you to use a private email address.
Setting your commit email address on GitHub
Commit email on GitLab
Now, your regular email address will be private and others can’t see it on those platforms.
But that also means that you now have two different email addresses that you have to add to your Git configuration.
There are different ways to tackle this problem.
For example, you can set a global configuration:
Friday Picks 015
Here are some things I’ve found useful this week or that I enjoyed:
A web scraping guide for beginners, part 1 and part 2 A weird experiment: The Boost Your Coding Fu With VSCode and Vim Auditory Experience! An Audiobook? A Podcast?! Just Enough Erlang Truly reactive programming with Svelte 3.0 - this post shows what’s exciting about Svelte.js 4 Rules for Intuitive UX - the minimum to get you started - a must read!
Learning About Clean Code With Elixir
Today I found an excellent article about Cleaning up your Elixir Code.
It shows how you can refactor your code and use best practices (hexagonal design with adapters/ports, dependency injection, decoupling business logic from implementation details).
I’m excited about learning about clean code and how to write maintainable programs.
For a beginner, it’s still hard to apply these principles.
Some frameworks, like [NestJS][nestjs], make this easier as they are very opinionated and enforce clean code principles.
The Odin Project and Full Stack Open
I’ve read about The Odin Project a few times on reddit.
People seem to be happy about this (free) curriculum, as it starts from zero, but doesn’t hold your hands.
They offer a Ruby course and a JavaScript course.
In comparison, Helsinki’s Full Stack Open course focusses on JavaScript. But they also teach you about GraphQL.
Both courses also offer you an introduction to testing - something which I’m very interested in.
An Introduction to Svelte by Dave Ceddia
One of the blogs I follow is Dave Ceddia’s.
He has a way of breaking down complex topics to the bare minimum. His blog posts provide a good overview of a topic without going too much into details.
Although I’m concentrating on learning the ins and outs of React, I still enjoy looking at alternatives.
One of them is Svelte. I wrote about Svelte before. My first impression was positive, as it feels like a straightforward framework to learn with lots of power under the hood.
Unknown Privileges
I’ve never realized how lucky I am to live in an area with a good infrastructure. At home, I have a stable internet connection with decent speed.
After I’ve tried to work remotely with a download speed of 2 Mbit/s, I now know what slow means.
The connection is also very fragile, disconnecting regularly.
I’ve never understood how much I rely on a fast and stable internet connection, when it comes to learning to code.
Friday Picks 010
Here are some things I’ve found useful this week or that I enjoyed:
As a senior developer, how do I better mentor an intermediate developer who is struggling? - Reddit thread about mentoring (might be useful to self-reflect on your own gaps) Digital Minimalism Review: Gazing Into the Abyss - an insightful review of “Digital Minimalism” by Cal Newport NestJS Tutorial für Einsteiger - (German) - I reviewed some of the content (it will be published in English next week) A complete guide to the Node.
Currently Working On
I’m currently working on the Udemy course Complete React Developer in 2019 (w/ Redux, Hooks, GraphQL) by Andrei Neagoie and Yihua Zhang.
So far, it’s been an exciting journey, and I appreciate that the instructors show an enterprise-ready app. In many courses, they teach you simple todo apps.
In this React course, you get to know Redux, reselect, and other patterns and libraries. That leads to a lot of complexity.
Uphill Conf 2019: How to Think
Today I watched this talk: André Staltz - How to Think - Uphill Conf 2019. And while the ideas were not new, it was still a good reminder about what it means to be a thinker in the context of being a programmer.
I recently learned about state machines and also Domain-Driven-Design. What I like about these concepts is that they force you to plan and to think before you code.
Friday Picks 009
Here are some things I’ve found useful this week or that I enjoyed:
Boilerplate Code - Starter projects in React, Vue, Python, Full-Stack - some useful boilerplates As a self taught developer, i feel like i missed out on a lot of CS theory/basics. Good curriculums to catch up with ? - some advice for self-taught devs New Node.js 12 features will see it disrupt AI, IoT and more surprising areas - the future of Node.
AWS User Group MeetUp
Yesterday I attended the Amazon Web Services User Group Dortmund MeetUp.
It was easy to travel to, very central in the city.
Around 40 people attended this event. The organizers offered pizza and beverages. Yay!
I wasn’t even the sole woman (2 out of 40 is good, right?).
The speakers gave a talk about AWS Fargate: Containerization meets Serverless. I’m no expert on AWS Lambda and AWS infrastructure, but it was interesting nonetheless.
Not Enough Time
So much to do, not enough time.
I’m interested in so many things, but I don’t have the time to learn them all.
Gatsby.js, Elixir & Phoenix (Phoenix LiveView!?), TypeScript, DDD, software architecture, CSS Layout, etc.
I need to remind myself that it’s ok to cut out some topics (Goodbye Flutter!😔).
And with having a job that’s not in the tech field, and a family, it’s difficult to dedicate time for learning so many frameworks and languages.
Learn About Gatsby Themes
Yesterday I finished Introduction to Gatsby, a beginners course by Jason Lengstorf, hosted by Frontend Masters.
Gatsby is a static site generator for JavaScript/React.js. It pre-builds your website and serves static images. Thus, it’s very fast.
But it can also load dynamic data because it also is a fully fledged React app.
The Gatsby team just released a big feature: Gatsby Themes.
Gatsby Themes are similar to Wordpress plugins. They are pre-configured and you can load them into your Gatsby configuration.
Learning About State Management
Today I listened to a React Podcast episode where Michel Weststrate was a guest. He talked about state management, MobX, and Immer, his new library.
Listening to talk like these, and the ideas behind JavaScript libraries and software architecture make me insanely happy.
I’m excited about learning such concepts and how they play out in web development.
It’s also humbling to realize how much I still don’t know.
I’ve been thinking about how to build and structure a front-end React app.
Vim Movement: Some Links
Here are some links I found useful to level up my VIM skills:
Fast movement and navigation inside Neovim Traversing text in Insert mode I’ve been switching between Vim and VS Code the last few days.
So far, I’m happier with Vim. I know the key bindings and can move between different files quickly. With VS Code, it’s less convenient, and I fall back on using the mouse. This slows me down.
Weekly Progress Report 26 2019
Nest.js I’m still smitten with Nest.js, a Node.js framework with TypeScript support.
Here are some resources to get started with Nest.js.
Vim vs. VS Code I’m giving VS Code another chance. So far, I’m not amused. I’m already too accustomed to my VIM workflow , and it’s a hassle to set up all my preferred key mappings.
Some plugins offer excellent language support out of the box (e.
Learn NestJS
Currently, I’m working through the excellent Udemy Course: NestJS - Zero to Hero by Ariel Weinberger. There are still some coupons to get a discount for this course.
I’m still excited about NestJS as it seems to be an excellent way to develop a Node.js/Express.js application with TypeScript and Domain-Driven Design.
The learning curve is steep if you are new to TypeScript and SOLID principles. But the author does a good job holding your hand and guiding you through coding the application.
NestJS Is Fun
I’m learning about TypeScript and NestJS right now.
There’s an excellent course on Udemy by Ariel Weinberger. It shows how to develop a CRUD API.
If you want to get a sense on how NestJS looks like, take a peek at this article: Creating your first Node.js REST API with Nest and Typescript.
NestJS seems quite opinionated, but in a good way. I like how it forces me to use a certain architecture.
Blown Away by NestJS
I just finished a Serverless React with AWS Amplify - The Complete Guide by Reed Barger today. I learned a lot about AWS and serverless functions.
But now it’s time for something different!
What about NestJS?
Nest is a framework for building efficient, scalable Node.js server-side applications. It uses progressive JavaScript, is built with and fully supports TypeScript (yet still enables developers to code in pure JavaScript) and combines elements of OOP (Object Oriented Programming), FP (Functional Programming), and FRP (Functional Reactive Programming).
Test-Driven Development Courses with Python and Docker
I have several courses, books, and video platforms I learn from.
One of my recent discoveries is Testdriven.io, a website dedicated to full-stack web development with Python and TDD.
I purchased the Microservices with Docker, Flask, and React course in February.
I’m happy to say that the author updates the course regularly. This proves to be invaluable, as outdated courses are a waste of money.
You begin by setting up Docker with Python and Flask and I already learned a lot.
Writing Ugly React.js and GraphQL
At the moment, I’m going through Reed Barger‘s course Serverless React with AWS Amplify - The Complete Guide.
I’m learning a lot about serverless JavaScript/React development with AWS.
But wow, does it get ugly. Code duplication, wrangling with the AWS back end, fetching data several times, etc.
I don’t have a lot of confidence in AWS Amplify. It makes it relatively easy to create a back-end API with GraphQL. But the documentation is lacking, the AWS web console confusing, and the pricing (after the free trial months) steep.
FreeCodeCamp YouTube Channel
Lately, I’ve been watching some videos from the freeCodeCamp YouTube Channel.
Some of the videos are quite good.
For example, the tutorials by Beau Carnes are enjoyable to watch. They don’t go into too much depth, but offer a good overview over a topic.
Kent C. Dodds is very knowledgeable about React, so his React course is worth watching.
All in all, a great place to go for learning coding topics suitable to beginners.
From Zero to App by Flavio Copes
Today I found a new exciting video course by Flavio Copes:
I am going to document the process of building an online diary Web App built using React, Node.js, GraphQL, Postgres. From zero (rough idea of what the thing will be) to deployment. The full project documentary will be a paid course, but I plan to make the first 10-15 videos free and document the initial process (still haven’t decided how many videos the course will be).
Common Sense Algorithms and Problem Solving
I’ve tried several online courses on learning data structures and algorithms. But nothing seems to stick.
Usually, video courses work well for me. I consider them more engaging than a book.
But for algorithms, it doesn’t work for me.
I’ve now bought some titles on learning how to solve algorithm challenges and books on problem-solving:
Think Like a Programmer
This book teaches you how to solve programming problems systematically.
Hazards of Being a Mom
Today I got up to spend some time coding and improving my skills.
During the day, I work as a tax officer, so I don’t have time to program.
I either have to get up early or spend my evenings learning to code.
Today, as soon as I booted up my dev environment, my younger daughter woke up. My coding session was cut short abruptly.
I managed to read a book about algorithms on my commute at least.
Egghead.io Sale
One of my favorite online learning resources for JavaScript and front-end development is Egghead.io.
They offer some free resources. But their premium tier is worth the money.
At the moment, they offer a steep discount (USD $150 instead of $250 for their yearly plan).
Some of my favorite courses:
Just Enough Functional Programming in JavaScript Data Structures and Algorithms in JavaScript Professor Frisby Introduces Composable Functional JavaScript Functional Programming in JavaScript with Ramda.
Learning About Thinking
There are a few blogs I follow that don’t teach you how to code. But they provide tools, models, and systems for learning how to think.
I’m very focussed on learning the technologies and techniques for web development. At the moment, other topics fall on the wayside (for example, improving my French).
But I still find some time to get to know new mental models and common wisdom.
Here are some blogs I recommend:
hashtag-100daysofcode-finished
I finished my first round of #100DaysOfCode!
First immediate reaction:
Let’s do something more useful.
Perhaps I’ve been doing it wrong. I didn’t have a particular goal in mind. I just love coding and learning to program.
I would have done something coding-related anyways. The challenge didn’t help me with motivation.
I enjoyed the hashtag on Twitter: #100DaysOfCode. It’s great to see so many people enthusiastic about coding.
It’s also nice to see a public log of my progress.
May 2019 Update
A quick check-in.
I try to attend as many MeetUps I can. It’s a bit difficult with two young kids and a job. But I’m lucky, and my husband supports me.
I enjoy that I can always learn something new at a MeetUp. Often there are talks about different technologies. I also like the social aspect of connecting with other developers.
I switch my learning between frontend (JavaScript, React.js, Svelte.js) and backend (Docker, Elixir).
EntwickelBar 4.0
Yesterday I was at my first Unconference. It uses the Open Space Method.
Nothing is planned. Participants can introduce new themes, give talks, or open discussion rounds.
I liked the format, and it was great to get to know new people.
My favorite session was “Your front end is a library”. It showed how you could build “vertical” micro-services. You divide your front end into logical sub-systems, and it isn’t a monolith anymore.
Making Slow Progress
Learning to code proves to be a slow and steady journey. I wonder about those folks who claim that they were coding for 4 months and then got hired.
I can imagine that they were very talented to grasp all those concepts quickly.
I am proud of what I’ve learned so far. I can still remember how stumped I was about basic concepts like variables, parameters, for loops in JavaScript. But I’m already learning more than 4 months.
Currently Learning
Right now I’m working on creating React apps with Hooks and AWS Amplify.
I’m looking forward to take a peek at Gatsby.js and Next.js.
I’m watching Deep JavaScript Foundations by Kyle Simpson (Frontend Masters).
I’m reading books about JavaScript, Domain-Driven Design, Elixir and Phoenix.
The book JavaScript Allongé, the “Six” Edition is now available for free, so I’ve grabbed it.
I’ve come to like JavaScript, although it has weird parts. I enjoy React.
Grateful
I realized today how grateful I am to be able to learn to code. It gives me so much joy to read about function closures, monads, software architecture, DDD, React Hooks, Elixir, recursion, etc..
Yesterday my brain hurt because I took a deep dive into React Hooks and the useEffect Hook. But at the same time, I have so much fun doing it.
When I had some free time today, I got to sit down at my computer and learn something new.
AWS Amplify
Today I started working with AWS Amplify and React. I bought a Udemy course, and use it as a learning aid.
Setting up AWS Amplify with JavaScript proved to be frictionless.
Creating a new GraphQL back-end API took me 5 minutes.
The Udemy course holds your hand and provides a gentle introduction into AWS Amplify.
I’m pleasingly surprised. But as someone with an affinity for back-end work, the lack of control bothers me a bit.
Learn to Debug And Chrome Developer Tools
Debugging is an essential skill for a developer. It’s an area where I have room for improvement. So far I’ve gotten by with console.log statements. But the Chrome Developer Tools can be helpful for a JavaScript programmer and more informative than simple logging.
Here are some resources I can recommend:
Ben Awad: Tips for using Chrome DevTools
Wes Bos 14 Must Know Chrome Dev Tools Tricks - #JavaScript30 9/30
Wes Bos 14 Must Know Chrome Dev Tools Tricks - #JavaScript30 9/30
The Coding Train
I’ve been feeling a bit under the weather so I haven’t had the energy to tackle hard topics.
For these kind of days, I always like watching videos on YouTube or Twitch, or listen to podcasts. You can learn new concepts but it’s not too complicated.
I’ve discovered The Coding Train on YouTube. I like how Daniel Schiffman works through problems. You can learn a lot by following his thought process.
Reactive DDD - MeetUp
On Thursday, I attended yet another tech-related MeetUp.
The location, Unperfekthaus, is interesting. It’s a space where you can meet and do (creative) projects. Attendees have to pay a flat fee for drinks, but the organizers don’t have to pay rent for the rooms.
The topic for the MeetUp was Reactive DDD—Transforming Digital Business with a talk by Vaughn Vernon.
I enjoyed learning about this topic, being new to software architecture.
Excited Learning
Here is a list of things I’m excited about and I’m currently learning or would like to learn:
Flutter for mobile development a deep dive into Elixir and Phoenix (and Phoenix Liveview) GraphQL Full-stack TypeScript with Nest.js and TypeScript React TypeScript best practices ClojureScript re-frame DDD with functional JavaScript and best practices Docker (more) React Hooks Styled Components/getting better at CSS (Flexbox, Grid) I’m currently concentrating on TypeScript and React mostly, with some stints in Elixir.
Workshop Responsive Web Design
Yesterday I went to a workshop about Responsive Web Design.
I quite enjoyed it. As always I learned something new. Most of the workshop’s agenda was aimed at beginners. That was ok and I expected it.
But when it came to the practical project, I learned something new about responsive images.
For example, the background-position CSS-property can help to reposition an image. This might be useful when you want to show a different part of the image on a mobile device.
DevOps and APIs MeetUp
Yesterday I went to my second MeetUp organized by Softwerkskammer Ruhrgebiet.
I met one of the co-organizers, Sandra. And it was totally cool to see another woman there. We also talked a little bit about how unfortunate it is that there are so few women in tech.
This Meetup’s talk was about DevOps and APIs. It was interesting to see the current API landscape and its pitfalls and how negligent design can have wide-reaching consequences.
Surprisingly Good Free TypeScript Udemy Course
I’m very interested in TypeScript at the moment. I love learning new things and TypeScript looks like a useful super-set of JavaScript.
It is well supported (by Microsoft), open-source, and seems quite popular according to the State of JavaScript 2018 survey.
It also compiles down to plain JavaScript.
As a beginner, you can slowly add valid TypeScript instead of having to immediately switch to a completely new language.
You can head over to Flavio Copes’s TypeScript Guide to get a sense on what TS has to offer.
Great Meetup at Softwerkskammer Ruhr
I was at a wonderful tech meetup on Wednesday. This was one of my first meetups and it was so much fun!
The organizer was super nice and approachable.
I enjoyed the lecture about REST to GraphQL although I would have liked to gain more insight into the topic. But the talk offered a nice first glance at GraphQL and what’s nice about it.
For me, it was wonderful to be able to talk about my passion for functional web development, different frameworks, and technologies with people who work in the industry.
Egghead.io Courses
One of my current favorite resources for JavaScript is egghead.io.
This paid membership site provides tons of short video lessons for front-end developers.
The quality differs a bit. Some courses are quite thorough, but some just scratch the surface.
For example, Up and Running with TypeScript only offered a glimpse of what TypeScript can offer.
The Cycle.js Fundamentals course by framework creator André Staltz gives you a good understanding of what Cycle.
#100DaysOfCode - a Recap After 15 Days
I did some work on algorithm challenges and data structures, but am now back to coding a Javascript/Node app called feedbacky.
I learned about authentication with Google OAuth using Passport-Next. Passport-Next is an updated fork of the popular Passport.js package that has become stale.
Authentication and deployment with Google OAuth, MongoDB (Mongo Atlas) and Heroku are extremely error-prone. Either the routes are wrong, the credentials/environmental variables, or maybe the dependencies. Heroku doesn’t deploy dev dependencies.
Doing vs Trying
In the last few weeks, I’ve upleveled my coding skills. I’ve been coding every day for at least an hour and I’ve finally taken the step to break out of tutorial hell.
Yes, I still learn with video tutorials. But after I’ve finished a tutorial, I rebuild the project on my own instead of relying on the assumption that I understood what I was doing.
This way, I identify the gaps in my understanding.
Udemy Course Reflections
I finished The Complete Web Developer in 2019: Zero to Mastery course a few days ago. I skipped some sections (HTML, CSS) which I plan to refresh later. Especially my CSS Grid and responsive design skills are shaky.
Things I learned or relearned:
DOM manipulations Taychons, a CSS library React (which I supplemented with Tyler McGinnis’s course) Node.js & Express PostgreSQL and how to integrate it into Node.js deployment of Node.
hashtag-100daysofcode
I started the #100DaysOfCode a few days ago.
The challenge sounds like a fun way to log my progress and participate in a greater community.
The idea behind the challenge is to code at least for an hour every day. I’m doing that anyway, so why not give my efforts an official name?
I’m still diligently working on Javascript and learning new ways to organize my code and to write solid frontend projects.
Be Humble
Sometimes I think I already know a lot about something. But often that’s not true. You can always dig deeper.
Often I’m ignorant about what I don’t know because I know enough to get by.
It’s ok that I’m not an expert in everything. I can’t concentrate on everything. With some things, it’s good to know just the basics. But with some things you should make an effort to learn more.
Worse Days
Some days are worse than others.
Some days feel like you’re making no progress.
What you want to build doesn’t work.
You try to come up with a solution for a complicated function. It doesn’t work.
You watched a tutorial and it made sense. Then you try to come up with a solution on your own. And it’s way harder than it looked. You can’t solve it without going back and looking up the solution.
You Can’t Learn to Code for Free
“Everyone should learn to code.” and even “Coding is easy” are some statements floating around on the internet.
There are tons of resources for budding learners. Some are low-priced, some are free. Take Freecodecamp, edx, Coursera, for example.
But you can’t learn to code for free. You may not spend money, but you will have to spend time (and nerves). You need dedication and hard work.
If you are an absolute beginner, coding will be hard.
Code Project: the Process
Things that nobody tells you but you somehow have to learn: the steps/how-to to code your app.
With a frontend app, you have a combination of HTML, CSS, and Javascript and you have to address them all. You have to write at least some HTML and write Javascript to interact with the DOM.
That’s surprisingly error-prone for a newbie.
Even a simple app has several moving parts. And nowadays, with tools like React you combine HTML, CSS, and Javascript into the “View” (the part where you tell the program how things should look like and it will then render it to the user).