Framer / General

How are you getting prepared for Framer X?

How are you getting prepared for Framer X?

Framer/General · August 3, 2018 · 5:45pm

How are you getting prepared for Framer X?

Framer / GeneralAugust 3, 2018 · 5:45pm
Hey everybody 👋
I just wanted to share some thoughts -first of all, I was lucky enough to have a go with the first beta of Framer X and I'm in awe. It's everything I've ever wanted from a design tool. Now personally I've been tinkering with Framer for the past 3-4 months, with almost no prior coding experience (I knew the mere basics around HTML and CSS). With time and a decent amount of practice, I got used to writing basic CoffeeScript for me to prototype a fair amount of interactivity around my prototypes. Since React is going to be the new Framework on which X is based on, do you take actions towards learning Reactjs if you haven't or you don't know it? Currently, I've been learning JavaScript Basics on Treehouse, since I believe I need to know the fundamentals before I jump into React. Do you have any recommendations or sources of where can I start learning React? Is there a set moment where I can start learning it?

August 3, 2018 · 6:30pm
like-fill
2
  • reply
  • like

I've started with the React course of @meng-to from https://designcode.io/ Like you I got no previous experience except for some bacis HTML and CSS and so far it works great (4 chapters done). Feel natural and very close to html/css

  • reply
  • like

I've also started this crash course: https://www.youtube.com/watch?v=Ke90Tje7VS0 But felt a bit overwhelmed and lacking some background. He explains it really well but it went a bit too fast for me.

like-fill
7
  • reply
  • like

This is gold!

  • reply
  • like

Cheers, mate!

  • reply
  • like

I've started with the React course of @meng-to from https://designcode.io/ Like you I got no previous experience except for some bacis HTML and CSS and so far it works great (4 chapters done). Feel natural and very close to html/css

Thank you so much, Ron. I was thinking about @meng-to's course as well.

  • reply
  • like

August 4, 2018 · 7:33am

With React coming to Framer X, how much vanilla JS you need to know before learning React. Should I just jump into React?

  • reply
  • like

@seri A basic background should be enough, the rest you learn while moving forward. Functions and classes are the most common things you'll encounter. From there on you'll likely run into some newer es-current/next constructs like spread, destructuring, fat arrows, class props (for auto-binding events), but it isn't that much. Babels "learn es2015" page is a pretty good overview: https://babeljs.io/docs/en/learn

  • reply
  • like

Thank you @0xca0a I will take a look.

  • reply
  • like

Hmm looking at first videos showing code in Framer, and I am quite surprised by the complexity. What was great about "old" Framer was that you could do pretty fancy prototypes with just 20-30 lines of code, without really knowing anything about javascript/coffeescript, without understanding anything under the hood, without any upfront planning and worrying about organizing your code. Even people who didn't fully understand Arrays, never heard of Classes etc. were able to create great stuff.

What I'm seeing now is plain vanilla React code. It's 100x more powerful, but really 100x more complex. Just looking at a line of code like export class Switch extends React.Component<Partial<Props>, <State> { … } might be pretty intimidating for anyone without any dev background. Just looking at the screenshot it seems you should have at least basic understanding of React and Javascript - what a class is, what's state, props, what's the component lifecycle, what events like componentWillReceiveProps(props: Props) mean and why they're needed, etc. etc. Getting to that point for someone who was struggling with coffescript arrays is quite a big ask. I personally do have a few years of dev experience, including writing React Native code, but I remember some of my plain vanilla designers asking me to help them get into "old" Framer, and how difficult it was for them to grasp the basic concepts without any previous dev experience. I was hoping for a layer of abstraction on top of this, focusing on animations, provided by Framer X. Kinda the same that "old" Framer was all about.

Framer X looks very exciting though. I have a great belief in Framer team - these are really smart folks who know what they're doing. Really looking forward to see where this goes. First impression is that it opens plenty of doors to almost endless possibilities. At the cost of shutting the door for many, though.

like-fill
1
  • reply
  • like
like-fill
1
  • reply
  • like

August 5, 2018 · 11:18am

@josefrichter From what I understood after being to a demo presentation is that you can do a lot of basic interactions with out having to code react. And that the reaxct part is more for creating or editing components etc. Also there will be a FramerX store with pre-made components, icons and UI elements.

like-fill
1
  • reply
  • like

August 6, 2018 · 7:28pm

Second impression after downloading the beta, reading into documentation and playing around with it: seems like the complexity I was surprised about is indeed gonna stay hidden under the hood for most folks. It's there for people who want to write more complex stuff and will allow them to write it a more organized and reusable way, which was a big pain in "old" Framer. And this in turn should allow guys on the other end of spectrum to do more advanced stuff with actually less or no code at all. So it's kind of opening doors on both sides! Similar to what @ron wrote.

For guys without coding experience asking whether or not to dive into React - I'd wait for beta 2 :-) According to docs, a lot of the stuff that's exposed now (I assume for guys competent enough to develop a bunch of components), is gonna be covered with a layer of abstraction allowing non-dev guys to reuse this stuff without headaches about React :-)

like-fill
2
  • reply
  • like

August 10, 2018 · 6:17pm

@josefrichter I am having the same reaction you mentioned in your first post. I would like to assuage my concerns. What documentation are you referring to?

  • reply
  • like

August 11, 2018 · 1:27pm

@josefrichter I am having the same reaction you mentioned in your first post. I would like to assuage my concerns. What documentation are you referring to?

https://framer.gitbook.io/framer/

  • reply
  • like

August 13, 2018 · 2:31pm

Thank you!

  • reply
  • like
Your message here...

*bold*_italic_`code````codeblock```