Hacker Newsnew | past | comments | ask | show | jobs | submit | xyz0's commentslogin

That's the idea when you're using D3 with React: React handles the DOM updates, D3 handles data wrangling and math. You said you reimplemented your charts in SVG directly – did you also reimplement scales, chart axis generation, d3-collections, d3-time, etc?


> What happened?

Acceleration of the following:

- commodification of information on the internet

- the subscription model

- incentives for tracking users' every move


Sure, modern JS tooling is complex, but a 14-year-old just looking to play around with programming isn't going to build a Facebook clone as their first project. You can always create a barebones HTML file and drop some JS into a `<script>` tag and be up-and-running in two minutes. If you don't want to use modern tooling that was designed for large-scale SPAs, then don't.


I was really turned off by react because of the necessity to use JSX, which in turn required me to use babel, its just adding too much complexity. So I'm still just using jquery.


I would suggest you to take a look at Vue; you can use it without any transpiler or heavy toolchain, just adding a good ol' script tag in your headers and voilà. The getting started guide [1] is awesome and translated to a gazillion of languages, so it also helps :)

I recommand Vue to any Javascript beginner that want to add interactivity to their page without having to handle the DOM manipulation themselves.

[1]: https://vuejs.org/v2/guide/


That is what I love about it.


I hated JSX too when I started doing React 4-5 years ago. Then I used Vue for a couple of years in part because of templates.

After that I tried InfernoJS which uses JSX because I needed the performance for a project and now I've turned around on JSX.

Personally I couldn't go back to template based frameworks like Vue or Svelte because they usually put you into this one component per file mindset. I much prefer being able to create micro-components in the same file like say buttons or table rows.

The thing that annoyed the most with JSX was that writing conditionals and loops inline was ugly or a pita. Then I discovered this Babel plugin and I love it:

https://github.com/AlexGilleran/jsx-control-statements


That plugin is the worst thing I've ever seen


I'm currently working on a project where some people had a bright idea of implementing this exact <If /> via a component instead of babel transform, so not only it looks like shit, it also breaks if you mention something that doesn't exist at this point...


Some reasoning would be nice.

I'm guessing this is mostly a nicety to paper over the fact that 'if' is not an expression in JS, so you have to do things like

    var foo;
    if (something) {
       foo = <SomeComponent.../>;
    } else {
       foo = <OtherComponent .../>;
    }
    
    <Container>
       {foo}
    </Container>
whereas if JS has if-expressions, you'd just say

    <Container>
       {
         if (something) {
            <SomeComponent.../>;
         } else {
          <OtherComponent .../>;
         }
       }
    </Container>
(or similar). From that perspective it seems like a nice little thing to have.


Dart actually observed this exact thing and added if expressions inside the language; more exactly, "if" works as an expression if it is inside of an initialization of a collection. It might seem a bit less elegant that the semantics of such an important token changes with context, but I think it solves this particular problem pretty well.

Dart also has spread operators and for-expressions to make writing "UI with code" much easier. It's fresh to see how language design choices are being made more by pragmatic ones (for Dart it's the fact that it's primarily being used for Flutter to make UIs) instead of ideological ones (One might claim that "if" should be a pure expression following the tradition from functional languages like ML, but that also has its own set of problems in a language designer's perspective)

https://medium.com/dartlang/making-dart-a-better-language-fo...


Yup, it's such a small thing, but it actually makes a huge difference. C++ has the same problem when dealing with optionals, etc. etc.

(I know absolutely nothing about Dart, but it does sound a bit weird that the expression-ness of an if is contextual. Is there a good underlying reason for the exceptionalism here?)


How come?


I'm not the person that insulted the plugin, but I had a less than positive reaction to it too. I would say that this is putting into the template what belongs as JavaScript.

In pretty much every case, where the README shows the "before transformation" and "after transformation" comparison, the "after" part is what you should be writing to begin with. This feels like adding an extra layer of abstraction just for the purpose of not learning to do some simple things in JavaScript itself.

I would be pretty annoyed if I started working on an existing React project and it had that sprinkled across all the components.


Try lit-html. You'll never look back.


If the cleanliness of their website is a hint to their usability, then this might catch on fast!


Try Choo (4kb ninja sword).

I think the design really nails it: just enough architecture, tagged template literal rendering, functional DOM tree composition with an optional component system.

I prefer to avoid stateful components in favor of pure rendering functions, as much as possible.

Choo's renderer is based on morphdom, which is interesting because it diffs against the real DOM rather than maintaining a virtual one.

I use monoapp, which is a fork of Choo allowing you to bring your own renderer (such as lit-html).

https://github.com/choojs/choo

https://github.com/jongacnik/monoapp


I would look into CRA (https://github.com/facebook/create-react-app). It handles all the Babel/Transpiling/Webpack mumbo-jumbo for you so you can focus on writing code.

Although I would eventually recommend learning how to utilize Babel & Webpack yourself because knowing why and how it works is useful.


If kart23's objection to complexity is how long it takes to get up and running, I agree about CRA. I agree about knowing the why of Babel and Webpack. But how they work isn't something everybody has to learn.

If it's some other objection to complexity, I'd recommend learning modern web dev using https://mithril.js.org/ which can use JSX, but in documentation the non-JSX form is primary.


I second Mithril with JSX. I've been using for a couple of months and it's amazing.

I started working on making the JSX docs a little better but got stalled... hopefully I will have some time later this month.

https://github.com/MithrilJS/mithril.js/pull/2551


You might like lit-html, which has a very similar structure as JSX, but does so with standard JavaScript: https://lit-html.polymer-project.org/

React:

    const Welcome = (props) => <h1>Hello, {props.name}</h1>;
    ReactDOM.render(<Welcome name="Taylor" />, document.getElementById('react-welcome'));
lit-html:

    const welcome = (name) => html`<h1>Hello, ${name}</h1>`;
    render(welcome('lit-html'), document.getElementById('lit-welcome'));


What do you get in return for losing all the react ecosystem?


Less required tooling, better performance, smaller bundle sizes, and more interoperability.


disclosure: this is your project


React is usable without JSX, which is just syntactic sugar for `React.createElement()` calls. If it's the complexity of babel/tooling that turns you off, it's also possible to use _just_ JSX without other transpilation steps: https://reactjs.org/docs/add-react-to-a-website.html#optiona....


I know I can use just JSX, but it looks really ugly, plus I have to set all the html attributes in createElement.

I guess my bigger complaint is that its all 'possible', but not recommended for production, its going to slow down your site in some way, etc. There are always drawbacks to not using the recommended way. Its like eating soup with a spork. Yeah you can do it, but its going to take you a lot longer than with the proper tool.


Not sure what you mean by necessity. I promise I’m not trying to be pedantic, but it’s not required. Plus, there are other, newer JS frameworks out there that use html templates and the like. The struggle is just maintaining valid HTML.


You don't need to use JSX, it just makes things nicer. But if your project doesn't already have enough complexity that it needs some sort of build tool, then react is probably overkill for your project anyway.


I dont use any build tool right now. You're right, I'm not building the most complicated thing in the world, but my site would definitely benefit from using react and I mostly want to switch to make future things easier, and jquery is already becoming pretty annoying.

Theres pages of content that can be sorted and filtered, so I mainly want to use it to dynamically update the elements, with the data coming from ajax calls.


I was also really turned off by JSX. It still feels like an abomination.

I love the fuck out of Vue.js/NUXT though.


unless you have to support internet explorer, modern browsers have a lot of native functions and APIs that can replace jquery easily (been hearing that for years, but last time I checked it really looked promising)


if you want to skip jsx, just write React.createElement(ComponentName, props) and your done. jsx just makes it a bit simpler to read, so no one feels tempted by horrible angular like template languages shudder


Honestly I would not shed a single tear if node.js and npm got thanos'd out of existence overnight. It is hands down the worst thing to happen to software, arguably even worse than C.


> You can always create a barebones HTML file and drop some JS into a `<script>` tag and be up-and-running in two minutes

Local "file://"? That isn't even trusted, current browsers outright block simple functionality like loading other files with XmlHttpRequest by default. You either have to completely disable various security settings or spin up a simple http server. At least I think that http is still enough for localhost, with the push for https you might want to set up a LetsEncrypt cert before you even think about starting a JS Hello World.


Not to put too fine a point on it, but is

> loading other files with XmlHttpRequest

simple functionality? To me that actually does sound kind of like an 'advanced' thing to even think of from a beginner's perspective... i.e. someone who's just trying to learn to make a web page with perhaps a little bit of interaction.

(But then, maybe my idea of a beginner's level of ambition is hopelessly old-fashioned, I don't know.)

I do think that it would be great if there were a way to tell a web browser through its Dev-thingy to actually serve a folder to itself as if it were served by a bona-fide web server with HTTPS. I mean, it's not that hard to start a python-http-module-server, or install the npm module 'http-server' (or whatever it's called), but y'know...

EDIT: I don't necessarily disagree with you, but I think it may be a matter of degree.


> I do think that it would be great if there were a way to tell a web browser through its Dev-thingy to actually serve a folder to itself as if it were served by a bona-fide web server with HTTPS.

I'd like to plug Beaker Browser as an amazing tool for getting started with barebones HTML, CSS, and JS. I would say Beaker marvelously fulfills this wish for a browser to serve a folder to itself.

https://beakerbrowser.com/

Because it is built around the peer-to-peer dat:// protocol, it also ends up being "local-first" regarding web pages that you write with it (as well as sites that you decide to seed).

@staltz has an interesting presentation on the utility of Beaker Browser: https://staltz.com/beaker-frontend-dev-dream-browser/#0

On the other hand, I don't know enough to speak to Beaker's capabilities with XmlHttpRequest.


When I was a teenager learning how the web works I used the free version for MAMP for this. It was super straightforward, as I recall. Open it up, choose a folder, and serve. I think it even included PHP.


i share your frustrations, especially as a retro and nojs fan.

today, for now, it's still mostly workable, with some fiddling, and yes, setting up a local web server.


In my experience teaching 14 year olds, that is precisely the kind of thing they first want to build: the things they know and use everyday (in 2020 it’s more likely to be Snapchat/Instagram/TikTok than Facebook, but the point remains).

And indeed, with a batteries included kind of solution like PHP/MySQL, one can build a basic Facebook like in a week long workshop or so. You won’t understand everything that’s going on under the hood of course, but the fact remains that it’s way more accessible than the webpack/Babel/react.js/etc stacks that web devs push these days (waiting for the inevitable “oh no one uses webpack anymore, it’s all about ChirpChirp.js these days!” :)


Are you just jumping around this thread copy/pasting the same talking points?

For what it's worth, someone getting banned from the comments section of an online forum run by a for-profit company is not fascism – it's not in the same ballpark, not in the same league.


> Lots of people, especially teenagers, are starting to suffer mental health problems because they think the world is about to end

Can you source this?

> It's important that people understand what climate science really says before a teenager does something they can't come back from.

Are you saying that climate change is so widely accepted and feared that it's causing the rate of suicides to increase? Wouldn't a better indicator of the acknowledgement of (supposedly-overblown) effects of climate change be, you know, individuals and governments taking action to curtail those effects instead of walking out of global accords [1], or actively contributing to the acceleration of those effects [2]?

[1] https://www.bbc.com/news/world-us-canada-40127326 [2] https://www.nytimes.com/2019/11/18/world/americas/brazil-ama...


Can you source this?

The first paragraphs of the article give both direct quotes from people saying they had that experience, and then cites a report from British psychologists saying they'd observed this effect at scale. Did you read the article?

Are you saying that climate change is so widely accepted and feared that it's causing the rate of suicides to increase.

It risks doing exactly that:

"Studies from around the world document growing anxiety and depression, particularly among children, about climate change."

People aren't scared of climate change as actually observed, they're scared of what they're being fed by people like Greta Thunberg, who is lying about the expected scale of the impact. The fact that journalists, politicians and even a few scientists are saying this despite it being false is what the article is about.


With respect to your first point, life expectancy during those times was age 20-30. Their standards of living were more akin to the standards for animals in zoos than modern humans.

Climate change isn't a religious doomsday prophecy. Since modern humans evolved 300k years ago, we've industrialized and created technologies that are accelerating the pace of the destruction of Earth. The claims in the article are based on verifiable science.


"Here's How Breitbart And Milo Smuggled White Nationalism Into The Mainstream" (https://www.buzzfeednews.com/article/josephbernstein/heres-h...)

Here's one of many relevant excerpts:

> These new emails and documents, however, clearly show that Breitbart does more than tolerate the most hate-filled, racist voices of the alt-right. It thrives on them, fueling and being fueled by some of the most toxic beliefs on the political spectrum — and clearing the way for them to enter the American mainstream.

> It’s a relationship illustrated most starkly by a previously unreleased April 2016 video in which Yiannopoulos sings “America the Beautiful” in a Dallas karaoke bar as admirers, including the white nationalist Richard Spencer, raise their arms in Nazi salutes.


[flagged]


Buzzfeed and Buzzfeed News are very different. Your dismissal is pretty ignorant.


They seem to be converging in quality, based on sloppy biased recent articles and sensationalized headlines from the latter.

I think not differentiating the branding better was a mistake, considering buzzfeed is synonymous with clickbait.


So someone asks for a nexus between Milo and white supremacists, and someone linking a source with a video of him serenading neo-nazis with their arms stretched out gets voted down?

The it’s-about-free-speech-not-alt-right-sympathy shtick really needs some update...


[flagged]


Would you please not break the site guidelines by taking HN threads further into ideological flamewar? It's predictable, therefore tedious, therefore off-topic on this site.

Even if other comments are already going there, going there worse is not cool.

https://news.ycombinator.com/newsguidelines.html


What? The reason starting a newspaper became so expensive is because of a much larger, national distribution model. You're still free to buy a $10k printer and sell newspapers in your hometown. If it doesn't contain hateful, violent rhetoric, you can even advertise it on Facebook!

If Amazon bans your books, you can still buy the book elsewhere, or get it from the author's site. Just because a piece of information isn't in the medium that you prefer to consume doesn't make it "censorship." It's not on Amazon that "few people are going to bother with that" when they ban you for violating their ToS.


But that person isn't attached to databases containing archived CCTV, scraped social media data [1], parking tickets, license plate reader data [2], phone metadata, or the myriad biased and unaccountable algorithms created by private companies, used to rank and sort humans [3].

Think about the implications for whistleblowers, journalists meeting anonymous sources, activists, immigrants, etc etc etc.

[1] https://www.nytimes.com/2014/06/01/us/nsa-collecting-million...

[2] https://www.aclu.org/issues/privacy-technology/location-trac...

[3] https://www.propublica.org/article/machine-bias-risk-assessm...


Guidelines | FAQ | Lists | API | Security | Legal | Apply to YC | Contact

Search: