Articles tagged with #javascript (53)
State management in react as it is most commonly spread among devs is suboptimal, I would say.
I just looked up my first react app, it's from 2014 and we used react to make working with HTML
in a "normal" DOM based page easier and code more readable. React didn't control all the page.
We used jQuery to animate between the pages, where each page was a react component.
Nowadays a react app tries to get the entire app to be react as quickly as possible.
Has it turned around, against us?
Continue reading →
I have been digging a little bit into Hermes (a mobile first JS engine)
focused on React Native. Since I shared most of it on twitter, I want to "copy"
the content here to persist it for me, I know I am coming back to this eventually and this way I get up to speed
faster.
Continue reading →
React Native (RN) 0.64 was just released.
One of the things I had stumbled upon more often lately in RN
code was the word "hermes". I didn't know what kinda tool or package that was.
Until I informed myself a bit.
In short: Hermes is a mobile optimized JavaScript engine.
Continue reading →
Somehow I came across a good example of applied hexagonal architecture
in JavaScript, it's César Alberca's blog.
He has all the source code on github.
Continue reading →
Finally I learned how to abort a fetch, see the post
React useEffect and fetch API
by @Jaime.
Continue reading →
Coming across "unary operators" might happen in JavaScript, or (m)any other programming language(s).
A couple examples for what is a "unary operator".
In JavaScript you may find: +1, -42, + "1", !true, delete x.
All those are unary operators as you can also read on
MDN
and in the
spec. But what does the "unary" really mean?
And why is 1 + 1 not using a unary operator?
Continue reading →
I am gladly using codeberg (as github alternative)
for as many projects as I can, really support their mission.
"Independent and powered by your donations and contributions".
I struggled a little bit to figure out the URL that works
for a package
that is not on npm yet, but exists just as a codeberg repo.
Continue reading →
I am currently working on a React Native app that uses redux saga heavily.
My main concern with it is the traceability of code that goes together, the modularization. It is hard, if not impossible to know
what belongs together, what is needed in combination with what.
Continue reading →
After live blogging on day 1
I made a plan for day 2.
I will watch all content in 2x speed and just pause whenever I need a bit to
write. It's just a video, so I can catch up by higher speed.
Also I came to the conclusion that I don't even need to be fully in sync,
except for the polls and the live chatting, but there is too much life
going on in parallel that I am glad about the pause button.
I am taking some notes here, basically for deeper learning and reminding me of knowledge.
If it is helpful for others, cool.
Minify all *.js Files
Continue reading →
#JavaScript
October 8, 2020
> (26).toFixed(1)
"26.0"
> (26.5).toFixed(1)
"26.5"
Continue reading →
While working on
pico-tester
I realized I am not as knowledgable in nodejs' support
for ECMAScript Modules (esm).
I think it's very simple in the browser.
There is
<script type=module>
which understands import and there is
<script nomodule>
which nicely gradually falls back to before ESM times. But what about nodejs?
There is a package.json with properties such as
main: <filename>, exports: {}
type: module, type: commonjs,
and any combination of them. For a long time I am using
the package esm
to allow me to use ESM on nodejs, but when publishing a package such as
pico-tester, I must be compatible with as many ways as possible, in which nodejs can be used.
So first there is terminology to get right (esm, cjs, ...) and than provide the right type of package or packaging
so it can be used there. I might update this over time with more learnings.
Continue reading →
The article
Node.js, Dependency Injection, Layered Architecture, and TDD: A Practical Example, Part 1
by @Carlos González
gives a very good introduction of how to structure a (TypeScript/JavaScript) app.
He links articles that allow one to dive deeper into underlying concepts and still explains the
big picture very well. Great job Carlos!
Continue reading →
Lea's article Today’s Javascript, from an outsider’s perspective
states yet another time that our JavaScript environment needs a reboot.
I also mentioned the topic a couple of times.
But what shall we do?
Continue reading →
Lately I am coming a across a couple of those tools that promise to remove the
bundling overhead and pain from our projects.
I already mentioned snowpack.
Continue reading →
With latest privacy awareness I believe cookies are also one sensitive topic. I have no numbers,
but I guess there are more people who have cookies disabled then we believe. If not, I learned something here.
Continue reading →
@Peter Coles wrote
"HTTP Cookies: What's the difference between Max-age and Expires?"
in 2009, but he has updated the article later and there is the answer for wether to use "expires" and/or "max-age"
when you set cookies.
Continue reading →
I wish to have a type system where I only need to type-hint the published parts (of a module/file)
and let the type system infer all internal types. Though, I learned that even in Haskell land it is referred to
as good practice to still type every function, no matter if public or private.
Flow sounds to be doing what I want.
Continue reading →
Looking around for resource for JavaScript developers that get into TypeScript I found this
TypeScript for JavaScript Programmers
in the TypeScript handbook.
Continue reading →
TypeScript 3.9 was released. Since I am basically a fan of making code safer and better to understand,
that's what I use types for, I see nothing interesting to me in this release. But I also use TypeScript
in a much simpler way than the cracks and fans.
https://devblogs.microsoft.com/typescript/announcing-typescript-3-9/
Continue reading →
You don't need to rename all your ".js" files to ".ts" to go all in on TypeScript, you can go gradually.
Adopt TypeScript step by step, become familiar with it in your existing JavaScript project.
No need to put development on hold for weeks, while you convert the code base to TypeScript and fix all type errors.
Read on to see how I adopt TypeScript for JavaScript for the sourcecode of jskatas.org.
I wanted to scriptNode.cloneNode(true) and expected it to re-evaluate the JS
of the node, but it didn't.
Continue reading →
Bundler like webpack take up too much of our intention, imho. We spend a lot of time configuring them and waiting for them to build so we can see our site. Snowpack moves the bundler out of the way so you can develop without worrying about it locally.
Continue reading →
I was just filtering a list list.filter(someCondition)
and I only wanted the first element in case there is one.
Doing list.filter(someCondition)[0] fails when the filtered list
is empty. So I am using slice(0, 1), which returns the first element
if there is one, an empty list otherwise.
Now I do list.filter(someCondition).slice(0, 1) and never list.filter(someCondition)[0].
Such small things.
Continue reading →
Run npm install <package>@latest to update to the latest version of a package,
no matter the minor, major version, it always goes to the latest.
Learning stuff about nodejs (or v8) while writing tests that ensure runtime behaviour,
using process.cpuUsage and process.memoryUsage. Curious how brittle those tests become over time.
Glad the app ALWAYS runs in the same docker container (dev and prod).
Continue reading →
Why a #mocha #test times out, when I write it like this: it('...', _ => {}); but it does NOT time out,
when I write: it('...', () => {});? Exactly, because the _ is the magic done, that one needs to call.
Continue reading →
If I look at all the code (tests=learnings) we created at our #jslang meetups, I think this is quite some knowledge.
Feel free to dig deeper into it and learn from it, find it all at https://gitlab.com/wolframkriesing/jslang-meetups
Continue reading →
Back on the road. Three days of EnterJS are just over and
I am already on the next trip, this time with HolidayCheck.
So let me quickly sum up EnterJS where I had the pleasure to meet lots of interesting new people and
to give a workshop on ES6 (and ES8) and a talk on the static type checker flow.
The callback-hell times are long over. We have better tools now. But which of the new kids on the block do you want to
play with? In this meetup, last night we tried out async functions, also known by the name "async/await".
It was a fun learning experience. Keep reading and get inspired.
While refactoring some badly tested code, a pattern of how I extract dependencies emerged.
The actual intention was to improve the testability. In this case dependency injection is the tool that helped me.
Read here to find out the steps I found to separate the dependencies.
I am convinced, that stricter types are of help when writing, reading and understanding source code. Why? Ever had the primitive obsession? And if you continue down the (type) rabbit whole, you get to stricter typing. And to Purescript, which attempts "to keep the semantics of JavaScript, while enjoying the syntax and type system of a language like Haskell".
Actually we are currently discussing and evaluating to use react or alike
and this react lifecycle comes in perfectly and somehow
also makes the point stronger that a well documented, cared and widely used
project is a good thing to be using.
Decided!
At this point in the EmberJS Framework Basics Part 2 video
the author explains how you can make (computed) properties out of 'normal' methods
by using what the ember.js Ember.Object offers.
It starts out with friend.age(), which returns what you expect.
The author wants to write this as a property (as one accesses it in ember!)
like this friend.get('age').
How is that done? Well, ember extends the native prototype of Function, so
you can write this inside an ember object definition age: function (){}.property().
730.975 byte - the size of the main JS file of an empty app that ends up in the dist folder
after building the app by ember build --environment=production.
Don't promisify fs.exists since this does not play by the rules of node style callback params,
where the first one should be err and then data. It seems this does return only the data, which
promisify understands as an error and does throw right away. Instead do what the
node js docs suggest
too and use fs.access instead, like so: promisify(fs.access)(aPath, fs.R_OK).
See it in action [here in the cosmowiki].
Since lots of things changed in babel6, it has become a platform
there is some stuff you need to do to set up your project to use babel6.
All is best described in "The Six Things You Need To Know About Babel 6".
browser field in npm's package.json
The new dojo? I started with dojo about 10 years ago, or so.
Now I see reapp which seems to be the same as dojo, lots of widgets,
just around react and transferred 10 years ahead and to mobile.
Good stuff? Or not?
Nothing to add to this post
I am sure my uxebu-partner @Tobias posted this link in our internal flowdock (never used it? do it now! it's Slack in better).
@Tobias knows all the tools.
Any browser project should have a look at DOMPurify at least, if not apply it right away.
This might not be what you want to apply right away, but maybe it triggers you to learn
more about this field, when security issues hit you it might be too late.
It's not additional synthesis, as I would interpret the headline first,
but it's pretty hard core cool what is possible in the browser already.
I wanted to just push my source code to github's master branch and all the deployment after that shall be automatic.
Every dev-op reading this will say "yeah sure, wtf?".
I don't get mocha to build with browserify, I always get
If you want to dive into cookies, here is the RFC6265. I was looking around for some decent cookie libraries. There seem to be some
of them.
I don't know why shelljs hasn't found me earlier :(
I read it first in my personal trending twitter search, then I saw it on hacker news
and I pulled the repo and being intrigued by the minimal size, compared to react and polymer
I thought I try out the demo, didn't work. So I looked a the code, very opinionated.
My conclusion after having spent about just 1h on it I summed up in this tweet.
In order to keep all your meta data of your project in one place
and only create files that actually just copy those data
you can use projectz
where you maintain data like title, description, author(s), badges, ...
in one CSON file and with a special markup you can update
fill in the templates files like README, package.json, ...
The introduction to Reactive Programming you've been missing
Lately they don't turn out so good, or is it my blurred vision?