teleren/devto huggingface dataset:
Package Flutter Linux App Into AppImage Part 1
Tags: flutter, appimage, linux, opensource
Published: 2021-07-05 19:27:13

---
title: Package Flutter Linux App Into AppImage Part 1
published: true
description: packaging flutter linux app into appimage using appimage-builder
tags: flutter , appimage , linux ,opensource
series: Flutter AppImage
cover_image: https://dev-to-uploads.s3.amazonaws.com/uploads/articles/wbpw070zj7uy4jm6pck2.jpg
---

Flutter is one of the fastest-growing cross-platform UI frameworks with a great and powerful community which has a great part of Flutter success.

<img src="https://assets.ubuntu.com/v1/29985a98-ubuntu-logo32.png" title="" alt="assets.ubuntu.com/v1/29985a98-ubuntu-logo32.png" data-align="center">

Lately, Flutter announced desktop support including Linux which got the attention of big corporates like Canonical (Publisher of Ubuntu), and lately announced that they are rebuilding Ubuntu Desktop Installer using Flutter.

Flutter official docs also have a section on how to build and package Flutter Linux app in Snap (Linux Universal Package Manager) and ship it to Snap Store. [here](https://flutter.dev/docs/deployment/linux)

So it will be interesting if we tried to package Flutter Apps using another universal package manager which is AppImage.

## Requirments :

- Linux OS (I will use Manjaro)

- Flutter with Linux config enabled ( assuming you have latest flutter stable version )

- AppImage Tool

- AppImage Builder

#### Install AppImage Tool and AppImage Builder

1- Install required deps

```bash
$ sudo pacman -Sy python-pip python-setuptools binutils patchelf desktop-file-utils gdk-pixbuf2 wget fakeroot strace
```

2 - Install Apimage Tool

```bash
$ sudo wget https://github.com/AppImage/AppImageKit/releases/download/continuous/appimagetool-x86_64.AppImage -O /usr/local/bin/appimagetool
$ sudo chmod +x /usr/local/bin/appimagetool
```

3 - Install AppImage Builder

```bash
sudo pip3 install appimage-builder
```

#### Create and build Flutter Linux app

1 - install required deps for building flutter linux app

```bash
sudo pacman -Sy clang cmake ninja pkgconf gtk3
```

2 - Enable Flutter linux desktop configuration 

```bash
$ flutter config --enable-linux-desktop
```

3 -  Create flutter project  `flutter_appimage`

```bash
$ flutter create flutter_appimage
```

3 - Build Linux App  

```bash
$ (cd flutter_appimage && flutter build linux) 
```

## Now, We are good to go to build the AppImage 🥳
How to create your own getEelmentById
Tags: javascript, dom, algorithms, dfs
Published: 2021-07-05 19:05:39

In this write up I am going to show how to create your getElementById function it will be similar to `document.getElementById`

So before we begin I want to clarify what `document.getElementById` does it. It is a function when called with a given id finds the DOM element which has same id as the one passed to the function. If there are multiple ids it then will return the first element. Before we begin writing our function let's quickly recap how DOM is structured and what are some useful methods which we can use.

## DOM
In layman terms DOM stands for document object model it is a tree like representation of HTML element. so for example lets say we have following HTML:
```
<!DOCTYPE HTML>
<html>
<head>
  <title>Hello World</title>
</head>
<body>
  <h1> A quick brown fox jumps over the lazy dog </h1>
  <div>
    <h2>This is a h2</h2>
    <p>This is a paragraph</p>
    <article>This is a article</article>
  </div>
</body>
</html>
```
For this HTML the DOM would be like this:
![Alt Text](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/10nimj6psiu4ejf947lq.png)
In the above image we can see all the DOM nodes for the HTML. There are different types of DOM nodes. You can see the list at [MDN](https://developer.mozilla.org/en-US/docs/Web/API/Node/nodeType). The `document.getElementId` works on HTML element and HTML elements have `nodeType` of 1. 

So first of all we need to get all the children of `document.body` we can do this by calling `document.body.children`, this method return `HTMLCollection` so we need to convert it into array now there are different ways via which we can do that but the simples one is simply used the spread operator eg `[...root.children]`. Now this array contains all the children of `document.body`. 

Now we will iterate over array and during each iteration we will pick an item from the array and we will check if the id of the elements is equal to the id we are looking for, this can done by calling `.id` on the selected item. if `id` matches then we will return the item otherwise we will repeat the same process on all of the children of the current element. In computer science this type of algorithm is called Depth First Search.

```
const walkDOM = (root, elementId) => {
 let result = null;
 const elements = [...root.children];
 for (let element of elements) {
  if (element.id === elementId) return element;
  if (element.children.length && element.nodeType === 1) {
   result = walkDOM(element, elementId);
   if (result) return result;
  }
 }
 return result;
};
const getElementById = (elementId) => {
 return walkDOM(document.body, elementId);
};
```

Please note that this is not a replacement for `document.getElementById` but a simple snippet showing how powerful and feature rich the DOM the API is and how far we can go in web development without knowing how these methods work.
Becoming a Junior++ Developer
Tags: career, codenewbie, programming, beginners
Published: 2021-07-05 19:01:52

![Person sat on table cross legged with a laptop](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/rj4ilzp0q79eu2gj55w9.jpeg)
When I started in my first dev job I hit on the idea of being a Junior++ developer. It was clear that the expectations on a junior developer were incredibly low and that there was plenty of time and room to explore and develop. I made sure to finish my tickets and get the work I needed to done, but I also did three things to set myself apart as more than a typical junior that I think anyone can do.

### 1. I made time to work with other juniors.

Working with senior developers is not uncommon, it's the best way to learn about the code base. But taking time to work with other juniors is a great way to mutually learn on something that you are likely equally lost on.

Working with a senior can become a very passive experience as they are so far ahead of you that you just sit and learn and absorb. Juniors tend to be ahead in some areas and behind in others, so we would unblock each others thinking at different points but the gap in knowledge was small and so no one felt like they were left out.

It was a very rewarding and engaging process.

### 2. Fix user pains that are too small to make it on to the backlog

Making time to speak to users directly let me fix a few tiny bug bears for people in the wider business. Things like a list being ordered the wrong way or a form clearing on error are minor enough to never make it to the top of the backlog but can be fixed by pretty much anyone with a spare 15 minutes.

Fixing these little annoyances shows initiative and also gains you fans in the wider business as you fixed their specific problem. It also gives you great experience working with users and owning a feature (no matter how small) from start to finish.

### 3. Do something to save your team or department time

We had an API that caused a number of support tickets per week. This was about 30 minutes of time for devs to fix. Not massive but annoying. The issue lay in the way the API fetched data from the database and an assumption made about the data in the request URL query params.

I spent five days across two sprints rewriting the logic in that API to fix that assumption and remove those support tickets.

Fixing this made me realise that the production logging wasn't good enough. So I proposed to my manager that I have a go at making a logging module that could be added to all out APIs and persist logs in one place. She gave me the ok and over 4 weeks, in between main ticket work, I created a Node logger that we could inject into all our APIs.

I worked with a senior developer on the logger and got it into production within a few days of it being completed.

Find a small pain point for you team and fix it, they will love you for it.

These three things combined are a great way to build a good reputation in you team and the business. They also help break up your day a little a give some variety of work that can sometimes be lacking in development roles.
CompileSwift viewer question on coding boot camps.
Tags: podcast
Published: 2021-08-05 03:03:05

---
title: CompileSwift viewer question on coding boot camps.
published: true
date: 2021-07-05 18:56:28 UTC
tags: podcast
canonical_url: https://www.compileswift.com/podcast/s03-e05/
---

{% spotify spotify:episode:4FH3f4UhGjeaDHFcFN00cS %}

I dive into more detail than I did on the live stream answer for anyone else that might be thinking about taking a coding boot camp. There are good and bad reasons, all covered in this episode.

I’d love to hear your thoughts on the subject.

p.s. you can find the live stream at [Twitch.tv/compileswift](https://twitch.tv/compileswift)
Keep that code clean and lean. Find the time, here are some tips
Tags: podcast, productivity, workflow
Published: 2021-07-15 18:50:49

---
title: Keep that code clean and lean. Find the time, here are some tips
published: true
date: 2021-07-05 18:56:28 UTC
tags: podcast, productivity, workflow
canonical_url: https://www.compileswift.com/podcast/s03-e06/
---

{% spotify spotify:episode:5voqjPupRqKajqqQI9OBuV %}

However hard we try, dust bunnies and tumbleweed eventually make it into our code base. We know we should go back and clean it up, maybe it is out of date libraries or code that is so out of date it will not compile anymore.

In this episode I'm going to offer a few tips on how to tackle this without it becoming a big burden.
How to Write Out Your Magic 8 Ball Method
Tags: skillcrush
Published: 2021-07-05 18:42:33

We are ready to create our magic 8-ball method now. In this challenge, we are going back to the magic 8-ball object we created and adding to it the method you will use to make it work just like a magic 8-ball. You will write pseudocode for your method just like the one we just wrote for the chair method we did in the last challenge. By the end of this challenge, you will have a method and a call to get your method to run.

### Solution
Let’s get started by setting up the function pseudocode. Underneath your magic 8-ball object, you will want to add the function keyword. Then you will want to name your method.

I’m going to name the one in this example ask question but you can use anything you like for yours. In the next line, we will put the stop keyword at the end of our method. Now it is time to write the instructions.

First, we need to get a question from the user. So the first line in the instruction will be the inputs. Put an input keyword then a question. 

This lets the computer know the user needs to give it a question to start working. Once the user has given a question, it is time for the magic 8 ball to start working. The second step will be where the magic 8 ball shakes. 

Underneath the inputs step, I will put that the 8 ball is shaking. The Magic 8 ball now needs to go through the list of answers and randomly pick one to show the user. The 8 ball can’t automatically pick an answer to give the user. 

It needs a list of answers to reference and pick from to decide what to display. After the second step, I will put a line that says the 8-ball picks an answer from the list of answers. We are in the home stretch with this method. 

The last thing we need to include inside the method is the output. The output in this method is the answer the computer had picked. Before the stop keyword, I’m going to add the output keyword and then answer. 

This lets the computer know they need to show the user the answer. The method is done. The last thing we need to do is call our method. 

Underneath the method, I’m going to call my method using the run function keywords. I call my method using the ask question name. Then I will use the with keyword before I list my parameter value.

This value is a yes/no question I can ask the computer. In this example, I am using the question “Will I ever learn JavaScript?” but you can use any question you like for your magic 8 ball.

### Finished Pseudocode
Congratulations! The magic 8-ball method is finally finished and ready for when you start writing JavaScript code later in this course. Here is a look at the finished pseudocode I created for this example. Don’t forget to indent your instructions inside your method.

```
OBJECT Magic 8-Ball
    PROPERTY list of answers
	
FUNCTION ask question
INPUT question
8-ball shakes
8-ball picks random answer from list of answers
OUTPUT answer
STOP

RUN FUNCTION ask question WITH INPUT "Will I ever learn JavaScript?"

```
How to Write Your First Method
Tags: skillcrush, computerscience
Published: 2021-07-05 18:41:10

Remember the chair object we made earlier? We are going to write some pseudocode where you will write the properties of a chair. You will then call the method to create a chair.

Skillcrush gives students the values of the parameters they need to use to run the method. In this challenge, you want to create a wooden, 4-legged chair.

### Solution
First, let’s create our function. Put a function keyword then name your function. I’m going to name this function assemble chair.

On the next line, put the stop keyword to end your function. In this example, I’m going to use the stop function since this is another way of telling the computer in pseudocode to end the function. Next, we are going to concentrate on the instructions for this method.

Underneath your function name, you are going to write the inputs the user is going to give the computer. In this method, you will need users to input the chair back, chair seat, and chair legs. So put an input keyword then list these parameters after it.

Now we are going to start assembling the chair. Underneath the inputs, we are going to start by attaching the chair back to the seat. So the first instruction is just attaching the back to the chair.

Next, the legs will need to be attached to the seat. The second step will be attaching the legs to the seat. All that is left to do is show the finished chair. 

Before the stop keyword, you are going to use the output keyword to tell the computer to show the finished chair. After the output keyword will be the assembled chair. After our function, we are going to call our method. 

So we will put the run function to tell the computer we are going to run our method. Then you will want to put the method name. Now we have to give the computer our input. So put with inputs keyword then list the values for the chair back, chair seat, and chair legs. These values will be a wooden back, a wooden seat, and 4 wooden legs.

### Finished Pseudocode
That’s a wrap on your method! We just finished the challenge and completed all the objectives Skillcrush has given us. Here’s a look at how your pseudocode might look. Make sure you indent your method instructions.

```
FUNCTION assemble chair
INPUT chair back, chair seat, and chair legs
Attach the back to the seat
Attach the legs to the seat
OUTPUT assembled chair
STOP FUNCTION

RUN FUNCTION assemble chair WITH INPUTS wooden back, wooden seat, and 4 wooden legs
```
How to Solve Objects in Magic 8 Ball Project
Tags: skillcrush, computerscience
Published: 2021-07-05 18:39:01

Now that we have our instructions, we are ready to start turning what we just wrote into pseudocode. In this challenge, we are going to concentrate on turning the ingredients into objects. You will take what you learned about objects to create objects and properties for the Magic 8 ball. Skillcrush hints students will only need one object and one property for your project.

### Solution
The object we will create for our project is the 8 ball. First, create an object using the object keyword. After that, we will name our object. 

I’m going to name the object Magic 8-Ball. We can now turn our attention to the properties. There are plenty of properties you can set for this object, but we are going to use the rule of abstraction here and just get the bare minimum of what is needed to make this project work. 

The finished project needs to show answers to a user’s question so the only other property we will need is a list of answers. Underneath the line for our magic 8-ball object, you will create a property using the property keyword. After this keyword, it will be the list of answers the ball will have and randomly picked when the ball is shaken.

### Finished Pseudocode
The first step of the magic 8-ball prep is completed! Here’s a look at how your object might look in your pseudocode. Put this pseudocode aside for now. We’ll add more to it later in this lesson.

```
OBJECT Magic 8-Ball
    PROPERTY list of answers
```
How to Write Out the Magic 8-Ball Instructions
Tags: skillcrush, computerscience
Published: 2021-07-05 18:34:58

Before we begin writing pseudocode, it is important to take a minute to write instructions for the magic 8 ball. Remember the recipe format we used earlier in phase one? These instructions will use the same format.

You will write the ingredients and instructions needed to make the magic 8-ball website work. Skillcrush provides students with a couple of hints to help students write these instructions.</p>

### Solution
First, let’s tackle the ingredients. The ingredients will later become an object and properties in our pseudocode. In this project, you will need two ingredients.

All you will need is a magic 8 ball and a list of answers. We don’t need to go into detail about what answers we want to use in our Magic 8 ball just yet. We will eventually put together our list later in this course.

```
Ingredients
* A magic 8-ball
* A list of answers
```
Now that the ingredients are done, we are ready to turn our attention to the instructions. There will be three steps the magic 8 ball needs to work. Underneath the ingredients, we will write down each of the three steps.

First, the Magic 8 ball needs a question. So step one is where the computer will get the user to ask a question about something that might happen in the future. Once the user submits a question, it is time to figure out how to get the answer.

The next step is where the Magic 8 ball will randomly decide what answer to pick. This is where the ball will shake as it figures out the answer. The last step is where the answer is displayed on the ball. So step three is where the magic 8 ball will respond and show the message.

### Finished Pseudocode
That’s a wrap for this challenge. Here’s a look at the instructions we just created for this project. You can add more instructions if you like, but remember the abstraction principle and keep the instructions to the bare minimum.

```
Instructions
1. Ask the Magic 8-Ball a question about a future event.
2. Shake the 8-ball
3. The 8-ball responds with an answer.
```
How to Define Properties of a Chair
Tags: skillcrush, computerscience
Published: 2021-07-05 18:33:07

Before we start working on the magic 8-ball project, let’s take a minute to practice creating an object and some properties. In the first challenge of this lesson, we are going to create an object in pseudocode for a chair. Making a chair may sound a bit strange, but it is a great way to practice creating objects since they have many properties and the properties values will differ for every chair. 

Don’t forget the abstraction principle. We want to focus on the important properties that are essential to creating a chair.

### Solution
Now let’s create a chair! First, let’s use the object keyword to let the computer know we are creating an object. We are going to name our object chair.

Next, we are going to create the chair properties. There are three properties in this challenge. So three lines of pseudocode will be for every property. 

In this example, the three properties you will need are the back, seat, and legs. For every property, you will use the property keyword before each of the property names. Don’t forget to indent each of the properties underneath the object line we wrote earlier.

### Finished Pseudocode
Below is an example of what the pseudocode for this challenge might look like. You can add more properties to the chair if you like. The goal here is to practice using the keywords just right.

```
OBJECT chair 
PROPERTY back
PROPERTY seat
PROPERTY legs
```
Funktor, Monada i Aplikatywa w Haskellu
Published: 2021-07-05 18:22:57

https://writeonly.pl/functor-monad-applicative

Trzy klasy typów Funktor, Monada i Aplikatywa są to prawdopodobnie trzy najpopularniejsze klasy typów do przetwarzania danych.
Pora poznać je lepiej
Web & iPhone Mobile Apps eBooks Bundle by Manning Publications
Tags: programming, codenewbie, webdev, javascript
Published: 2021-07-05 18:16:07

![Web & iPhone Mobile Apps eBooks Bundle by Manning Publications](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/egnyf8eeq97btogfms30.jpg)

[Web & iPhone Mobile Apps eBooks Bundle by Manning Publications](https://www.humblebundle.com/books/web-iphone-mobile-apps-manning-books?partner=indiekings)

How many apps do you use every day? One? Ten? 50? More? And we don't just mean on your phone; what about everything you use for work, play, and watching TV and movies? Your digital life is run by apps, so why not create something of your own?

Get eBooks like Flutter in Action, JavaScript on Things, and CSS in Depth, and enjoy making your phone and web experience a little more you. Your purchase of this bundle helps support Teach for America, who enlist, develop, and mobilize promising future leaders to grow and strengthen the movement for educational equity and excellence, as well as a charity of your choice.

This bundle launched on July 05, at 11:00 am PST and lasts through July 26, 2021. Pay what you want and support charity!