5 ms·

We just launched a redesign and ground-up rewrite of Guilded, which makes it easier for gamers to build and organize teams. There are also a bunch of of new fea

We just launched a redesign and ground-up rewrite of Guilded, which makes it easier for gamers to build and organize teams. There are also a bunch of of new features, like fully-featured forums, customizable team dashboards, team streams, and team rosters. On the tech side, the frontend was all written in React 16 + MobX. Besides the redesign and new features, there were a lot of technical goals related to the frontend infra that we were trying to achieve, which are allowing us to move a lot faster now. Anyways, hope you all think it's cool, would love to hear any questions/feedback.

zaptheimpaler 9y ago
This looks really cool! This is not super related to your business, but do you have any recommendations for how to get started with frontend dev as a beginner? I usually do backend/infra stuff, and the frontend world is overwhelming - particularly CSS. Do you have any tips on the best way to learn CSS? And do you think using React + MobX allows faster dev compared to vanilla javascript?
- iEchoic 9y ago
  Thanks! I think the best way to get started right now is to grab the official Facebook create-react-app package, pick something you think would be fun to build, and just start trying to build it and googling/asking questions along the way. The first project might suck, but that's okay. You'll pick it up fast, and the next will be better. React + MobX is my favorite way to build frontend apps now, and MobX does help a lot in terms of development speed, maintainability, and performance, in my experience. If you're brand new to frontend development, I wouldn't worry too much about it, though - it can be best to start with the basics initially.
  - 2474 9y ago
    To add to this. For beginners it can be a pain to learn how to set your environment up to even begin developing. https://codepen.io/ https://codepen.io/ is a great place for front-end developers to hone their skills without having to worry about any of the setup. You can use Pug (formerly Jade), Haml, Markdown, Slim, SCSS, Sass, LESS, PostCSS, Stylus, Coffeescript, Typescript, Livescript, Babel, or just plain HTML, CSS and JS without having to set up a thing. Edit: I'm not affiliated with Codepen. I am however a user.
  - matdehaast 9y ago
    iEchoic congrats on the new design! Very slick and smooth. Just a quick question. Are you using CRA with SSR (ie with nextjs or other solution?) for the new site? Or is it just a large SPA served from static html,js,css bundled? Thanks Matt
    - iEchoic 9y ago
      Thanks! No SSR here, just an SPA (static html/js/css) served up via CDN. We do use code splitting to load bundles progressively to keep the bundle size down.
- Karawebnetwork 9y ago
  Not CSS, but reading those three articles should give you a good primer on JS: https://medium.com/the-node-js-collection/modern-javascript-explained-for-dinosaurs-f695e9747b70 https://medium.com/the-node-js-collection/modern-javascript-... https://medium.com/@parsyval/javascript-prototype-vs-class-a7015d5473b https://medium.com/@parsyval/javascript-prototype-vs-class-a... https://medium.freecodecamp.org/here-are-examples-of-everything-new-in-ecmascript-2016-2017-and-2018-d52fa3b5a70e https://medium.freecodecamp.org/here-are-examples-of-everyth...
joshmn 9y ago
I just want to say that I've always thought you had/have the most beautiful site. One of the boys from your batch at Sixty introduced me to Guilded ~6 months ago and I've been smitten since.
- iEchoic 9y ago
  Thanks :)

zaptheimpaler 9y ago

This looks really cool! This is not super related to your business, but do you have any recommendations for how to get started with frontend dev as a beginner? I usually do backend/infra stuff, and the frontend world is overwhelming - particularly CSS. Do you have any tips on the best way to learn CSS? And do you think using React + MobX allows faster dev compared to vanilla javascript?

iEchoic 9y ago
Thanks! I think the best way to get started right now is to grab the official Facebook create-react-app package, pick something you think would be fun to build, and just start trying to build it and googling/asking questions along the way. The first project might suck, but that's okay. You'll pick it up fast, and the next will be better. React + MobX is my favorite way to build frontend apps now, and MobX does help a lot in terms of development speed, maintainability, and performance, in my experience. If you're brand new to frontend development, I wouldn't worry too much about it, though - it can be best to start with the basics initially.
- 2474 9y ago
  To add to this. For beginners it can be a pain to learn how to set your environment up to even begin developing. https://codepen.io/ https://codepen.io/ is a great place for front-end developers to hone their skills without having to worry about any of the setup. You can use Pug (formerly Jade), Haml, Markdown, Slim, SCSS, Sass, LESS, PostCSS, Stylus, Coffeescript, Typescript, Livescript, Babel, or just plain HTML, CSS and JS without having to set up a thing. Edit: I'm not affiliated with Codepen. I am however a user.
- matdehaast 9y ago
  iEchoic congrats on the new design! Very slick and smooth. Just a quick question. Are you using CRA with SSR (ie with nextjs or other solution?) for the new site? Or is it just a large SPA served from static html,js,css bundled? Thanks Matt
  - iEchoic 9y ago
    Thanks! No SSR here, just an SPA (static html/js/css) served up via CDN. We do use code splitting to load bundles progressively to keep the bundle size down.
Karawebnetwork 9y ago
Not CSS, but reading those three articles should give you a good primer on JS: https://medium.com/the-node-js-collection/modern-javascript-explained-for-dinosaurs-f695e9747b70 https://medium.com/the-node-js-collection/modern-javascript-... https://medium.com/@parsyval/javascript-prototype-vs-class-a7015d5473b https://medium.com/@parsyval/javascript-prototype-vs-class-a... https://medium.freecodecamp.org/here-are-examples-of-everything-new-in-ecmascript-2016-2017-and-2018-d52fa3b5a70e https://medium.freecodecamp.org/here-are-examples-of-everyth...

joshmn 9y ago

I just want to say that I've always thought you had/have the most beautiful site. One of the boys from your batch at Sixty introduced me to Guilded ~6 months ago and I've been smitten since.

iEchoic 9y ago
Thanks :)