Thanks for all of the lovely questions, I'll have to call it a night! I hope this was interesting, and if you have any unanswered questions you can always reach me on twitter (https://twitter.com/mxstbr) or ask me at my GitHub AMA! (https://github.com/mxstbr/ama)
Huge thanks to Hashnode for setting this up, it's been a pleasure. Have a good one!
You are a speaker, work as an open source developer, maintaining a variety of popular open source projects.
You created react-boilerplate, one of the biggest React starter kits with over 10,000 stars on GitHub. It's used by companies all over the world to kickstart their new products.
Have you managed to monetize your developments?
Yes, I have, thanks to OpenCollective. (see https://opencollective.com/react-boilerplate)
Historically, donating money to open source projects has been hard for companies, as donations can be written off but only with a legal entity behind the receiver—and which open source project has a legal entity behind it except for the very biggest?
OpenCollective solves this exact problem. They have host companies all around the world, so both users and companies can donate to open source projects without problem, and they'll get their logo in the READMEs of popular project as a return for their help.
It's also fully transparent, meaning everybody can see exactly where the money goes, and contrary to Patreon works perfectly for teams. (whereas Patreon only works for a single person)
Sorry for the rambling answer, but I'm super excited about OpenCollective and how it finally enables us to create sustainable open source projects.
What advice would you give to fellow 20 year olds starting their careers?
This does't only apply to 20 year olds, I guess, but it's important to remind oneself sometimes:
Nobody knows what the fuck they're doing.
It's just the way it is, our field is so big and there's so much happening nobody is keeping up with everything. Don't worry about it, do good work that you're passionate about and you'll probably be fine.
(also see this great picture https://twitter.com/dan_abramov/status/702649696683204608, and the related post: https://medium.com/@mxstbr/nobody-knows-what-the-fuck-they-re-doing-b62945f88b0d)
I recently quit my first job of 1 year, where I worked on a front end framework for a custom solution for AEM, where I learnt a lot. I recently had to quit, and so I decided to contribute to an open source react project Gatsby, but it's taking time to get my first pull request up. What suggestions/unsolicited advice would you like to give to people like me starting their careers trying to make open source contributions?
P.S : How should I approach contributing? Through picking up a bug, intimating the maintainer/creator that I'm interested to work on it, and then going forward, or some other way? I'm wary of communicating with the creator/maintainer for some reason (probably low confidence)
This is a great question, and something I struggled with a lot at the beginning!
The most important advice I can give you is to solve problems you care about and to share your solutions with the world.
Contributing to open source is something you need a motivation for. Without motivation, you'll give up before you've pushed your first commit. I've noticed over and over again that contributing for the sake of filling up your CV or becoming "famous" doesn't work.
The single biggest reason I do so much open source and enjoy it as much as I do is that I solve problems that I have. I solve these problems, no matter how small or big, and share my solutions with the world.
Sometimes, like in the case of react-boilerplate or styled-components, a lot of other people also have that problem and these solutions become big open source projects! On the other hand, very often my solutions are totally ignored by others, like my first npm module, scrolled. (https://github.com/mxstbr/scrolled)
That doesn't matter to me though! Both scrolled and styled-components do the same thing, they solve a problem I had in the way I needed it. Some of my solutions are helpful to other people, and that's great and motivating as hell now that that's the case! But it's not why I started open sourcing things.
To sum it up, solve problems you care about and then share your solutions with the world. That way, if others use your solution, great! If not, you've just solved your own problem. Win-win situation!
What convinced you to become a ReactJS developer?
I wrote about this in my 2016 in review blog post (http://mxstbr.blog/2016/12/a-dream-come-true/) so I'll just quote from there:
I decided to become an employable front-end developer by taking a break from university and going to London for a three month internship at Animade.
That's basically it, all of this only happened thanks to @simonneveu and @jameschambers!
Why Thinkmill is interested to have a 100% open source developer in their company?
You'll have to ask Jed Watson (one of the owners of Thinkmill) for a specific answer to that! I can tell you what it looks like from my side:
Thinkmill, as a company, is much faster at producing value for clients due to open source. We use lots of OSS (React, Node, MongoDB,..) and without that we couldn't do what we do. Investing in a developer to work full time on open source is a way of giving back to something we've gotten a lot out of. (next to every employee working ~25% of their time on open source)
Also, I build tools that help Thinkmill do their job faster and easier. styled-components is a great example that'll help a lot when creating cross-platform applications, and allowing Keystone users (which includes our clients) to theme their applications!
How dope does it do?
What real world problem React is solving? What are benefits of React, what it gives for developers, businesses and users? Why learn another framework, learn custom, non-standard logic like JSX, set up custom build process instead of using web standards, Vanilla JS or other library which is faster and lighter then React?
Virtual DOM is actually a needless abstraction layer which makes apps slower and requires more machine resources, why all the hype about it and why it is used in React?
What would you change in web standards? May be you have participated in any discussions/working groups already? What is your opinion on improving the
<template> as described in this proposal?
What do you think about 15 kilos dogs?
I can't wait to meet her one day!
In case you didn't know, Javi has a lovely dog that weighs 15 kilos. You can follow her on Twitter here: https://twitter.com/korathadog
Keystone.js looks like a great project, I see that you guys are on version 0.3.1.7. How secure is it right now?. Do you foresee this project becoming ready for production anytime soon?
Hah, this is a lovely question!
We've been using Keystone for our production applications at Thinkmill for over 2 years now, serving millions, if not billions by now, of users. So, it's totally secure and absolutely ready for production. Actually, not only ready for production, it's battle tested with huge, real world apps.
The version number doesn't reflect that, so the next major release (which is currently in beta and already used in production by us) is going to be v4.0.0! (see this announcement blog post: https://github.com/keystonejs/keystone/issues/3415)
Remote codebase audits (http://mxstbr.com/audits/) is a great idea! How is it working out for you?
Quite well, I've done a handful of them by now! It's a great way for me to earn some money on the side while helping companies with my experience from the past years. It's also a great way for me to get new ideas and inspiration of things we could do in react-boilerplate!
Max, Have you tried Angular 2? What's your opinion on it?
I have only tried it once for a very short amount of time, so I don't really have an opinion about it specifically I'm afraid!
There's one thing I can say more generally though: I like how many frontend frameworks, libraries and methodologies are converging around this shared model of "components".
The old model of thinking about websites as "documents" doesn't work for the complex applications we're now building on the web. Components are a much better model for building user interfaces.
When are styled components 2 supposed to be released?
Sometimes within the next few weeks. We're really close, and it's a really exciting release with lots of changes you'll love. I can't wait to show it to everybody!
You speak really fast. But have you measured your typing speed?
Sorry about that, my brain tends to get ahead of me and I frantically try to keep up, which is why I talk very fast sometimes 😉
Depending on what I'm typing and which keyboard I'm on my typing speed is around 100–120wpm!
How I can plan the architecture of website in reactjs. How to break a whole design in components.How deeply break the page in components. #BestPractice
I've talked at length about the architecture part during this talk: https://vimeo.com/168648012
In terms of breaking things down into components, it's super valuable to go as small as you can. Build tiny, tiny lego blocks that are super simple, and then almost all you have to do to build a complex application is compose these tiny lego blocks together.
Because you understand the tiny pieces, you also easily grasp the whole app without big trouble. It's amazing!
Do you have any suggestions to convince the company I work for to sponsor the tickets for one of those expensive conferences? 🙃
Tell them Max Stoiber is speaking 😉
Just kidding of course. The best way to convince your company to send you to a conference is to be accepted to speak, that's free PR for them! (and a great way to hire new developers)
Submit CFPs to all the conferences you think are awesome, even (or especially) if you don't think you have anything to say, and believe me, many will accept you. See http://weareallaweso.me for some tips about CFPs and public speaking, and http://mxstbr.blog/2016/12/a-dream-come-true/#conferences if you don't believe that I know what I'm talking about.
How did you first get into programming?
I got into programming through high school and Minecraft, mostly. Every student of my school (http://popperschule.at/en) had to create their own "personal website" inside the main school website. (that doesn't exist anymore)
That was my first contact with coding through HTML and CSS. I was into computers all throughout high school, though more on the gaming side of things. (Minecraft ftw)
When finishing high school in Austria, one has to write a 40 page paper about a topic of your choosing, and I (for some reason I can't recall) ended up choosing network protocols, specificially I wrote about TCP/IP.
After a few months of reading and work I had this huge, 45 page, technical and very dry paper about TCP/IP, but had never actually done anything with it. I wanted to use all of that knowledge I'd accumulated, so I thought "Hmm, what's an easy thing to do where one kind of needs networking knowledge?"
Turns out a web server to host a website is quite close to what I wanted to achieve, so I set up Apache on a Raspberry Pi at home. Then I had a web server, but for that to be useful there also needs to be a website. So I set up a tiny little website, pure HTML, and from then on I have kind of never stopped tinkering with that website!
Thanks for the AMA. What's your favorite way to structure React and Redux Application? What do you recommend?
One of the things i struggle most with is distributing my time between day job, side projects, open source contributions, personal/social commitments, and, in your case, public speaking engagements and of course AMAs on Hashnode.....
Could tell us a little bit about your routine (if any).. specifically interested in how you manage your time and/or plan your day/week/year? Any tools used? Adopted any techniques (ex. Pomodoro)?
Judging by just the sheer volume of high quality work you're involved in i'm really curious about how you orchestrate this act of super human ability.
Side note: that sheer volume of high quality work is a total illusion. I'm a horrible procrastinator, in 2016 I spent over 1100 hours on Twitter, that's almost 30 full work weeks! (tracked with RescueTime)
The reason you might think I have a lot of high quality work is due to the fact that it's open source. Imagine if all of the code you wrote was open source. On top of that a lot of people contribute to open source projects I'm involved in, so most of the code you see isn't technically "mine".
To answer your question, I wish I had any reasonable routine. I use a bullet journal (yep, real paper) to try to stay organised and also try not to look on my phone first thing in the morning (see http://mxstbr.blog/2016/12/productivity-trick/), but that's not as easy as it sounds 😅
I'm still working on that part, hopefully by the next AMA I'll have a better answer!
I use your boilerplate for my projects but recently I came across next.js. It's a framework built using react especially for server side rendering. You might know about zeit team as they are somehow connected to your styled-components open source project as I have heard. so, how would you rate between 'react-boilerplate' and next.js.
I have been following your repo progress on server side rendering. I want to know that how much long would it take to come out (super excited for this)!
I'm good friends with Guillermo, who is one of the Zeit team. I love what they're doing with Next.js, and I know they're solving an unsolved problem! (in fact, we're using Next in one of my latest projects, https://daybook.co)
The difference between react-boilerplate and Next.js is that react-boilerplate has always been focussed on apps. On the spectrum between websites and webapps Next sits in the middle, it allows you to easily build a hybrid, whereas react-boilerplate tries to be the best starting point for webapps. (which is also why the SSR integreation has been such a challenge)
I can't tell you yet when the react-boilerplate SSR PR will be merged, as it'll need serious real world usage before we can consider shipping it to every user. Please use it and let us know how it goes!
I am currently in my last year of technical college (HTL) and I've been working a lot with OSS the past few years and my plan is to work in that area once I graduate next year.. But I have also been thinking whether I should go to uni or not since I would rather jump straight into the industry working with JS as a front end developer.
Do you think that a uni degree is neccessary to land a nice job in that area, especially if I wanted to work abroad (outside of Austria)?
What's your educational background?
I tried studying twice, and gave up both times because there was almost 0 overlap with my interests. (see http://mxstbr.blog/2016/12/a-dream-come-true/) I'd still encourage everybody to try it, as you'll never get an easier way into a lot of knowledge about the topic. (especially if you come from a HTL, since you'll already have a bit of basic knowledge and interest in that direction)
I don't think not having a degree has really negatively impacted me, apart from the fact that I'll never be able to work in the US. (which I don't really want to with the new president, anyway) I'm learning the things I missed by not going to university as I go along and need them (e.g. algorithms and data structures), and I don't think I'll ever stop doing that!
Hi Max! What do you think about the future of CSS components in native CSS—do you foresee things like style scoping, element queries, container queries, and new scoped selectors ever arriving in native CSS?
Why the hell you didn't invite me to heliskiing?!!!
Why the hell didn't you buy a ticket? 😁 (this is what he's talking about, the most epic conference ever: https://twitter.com/mxstbr/status/823938714346934277)
I use your boilerplate for my projects but recently I came across next.js. It's also a react boilerplate especially for server side rendering. You might know about zeit team as they are somehow connected to your styled-components open source project as I have heard. so, how would you rate between 'react-boilerplate' and next.js.
What do you think is the most exciting project in opensource and why is it ReactJS and its family of frameworks/tools? :P
What are the drawbacks that ReactJS and its family of tools should fix to be better?
The React community is a huge part of what makes it awesome. Everybody is experimenting and trying out new things, with new ideas making the rounds every single day.
No matter what drawback or issue you find, somebody's already found it and is working on a solution, guaranteed. It might not be the right solution for your use case, but you can always just experiment on your own.
It's super exciting to be a part of this amazing group of people!
I'm always confused about when do you use functional declaration and when you would functional expression. I'm asking this from a React components' perspective but this can be generic enough.
I don't know of any particularly good reason to choose one over the other, I mainly try to be consistent within the project I'm working on. This means I go either all function expression or all function declaration for the particular project, and try to not switch it up for half the components!
I'm also coming from pure JS/jQuery to React world, but working at the firm that works in GWT (and hate it very much). What's the arguments would you give to ditch GWT in favor for some more modern framework/lib? :)
I work for a decade old FOSS project, we're thinking of spending 3-6 months rewriting core parts of it to modernize the ORM and testability. When is this a good idea vs doing shorter term incremental refactoring?
Because React relies on heuristics, if the assumptions behind them are not met, performance will suffer. Could we expect any further performance tuning contributions to the React reconciliation algorithm?
I can see you have worked on many open source projects. So do you work on them in your spare time or some one hired you to do things like KeystoneJS ? If you do it in your spare time then how you manage to do it? Any advise for someone who want to do such open source projects as well while doing full-time job as well?
The world of web development is moving so fast. How do you keep motivated on learning new things? How do you select the projects worth pursuing? What do you do to keep your skills sharp?
what are the tricks squeeze the bundle size of a reactjs app or any frontend app?
What's one thing that you
- Absolutely love about React?
- Absolutely hate about React?
Do you prefer any typechecking lib/tool or just React? Or.perhaps TDD? recommendations?
Have you worked with PREACTJS? What's your opinion about its philosophy?
What suggestions do you offer for people who are eager to start their new project with it instead of reactjs?
Hi Max, I've recently discovered the styled-components project and I have some unresolved questions:
- parent/child relations: how to express them? I had read something on the issues of the project, but I don't know (yet) an official solution...
- developer experience: since its css in js, we can't take advantage of the classic css livereload during development. I know that we now got hot module replacement (from webpack at least), but Its a bit unstable isnt it?