ViewModel 2 - A new level of simplicity

announce
330

I want to expand on D’s 2nd point.

You can think of ViewModel as a thin layer on top of Blaze. Syntactic sugar if you will. So your questions are better answered in terms of what Blaze can do and where it’s going.

Is it ready for production?

A lot of people and companies use it for production.

Will it work with Material?

Material works with ViewModel (there’s no reason it shouldn’t) but I don’t know which version you should use (not an Angular since this isn’t Angular)

What does the future hold?

ViewModel for Blaze will continue to work with Blaze as long as Blaze maintains backward compatibility.

All that being said I have to be honest (for once?) and say that for my next project I’m not going to use ViewModel for Blaze, I’m going to use ViewModel for React. The syntax is even cleaner and being a thin layer on top of React it means you have access to hot module reload, server side rendering, and anything the React ecosystem has to offer.

Let me know if you need help with anything.

2 Likes
331

Thanks @daveeel and @manuel that really helps.

My bad I thought for some crazy reason ViewModel was built on Angular2’s rendering and event model somehow.

Sounds like I’ll go with your React ViewModel implementation as a view handler.

And thanks for the offer of help I’ll probably pipe up with a curly one sometime

cheers

332

You may have gotten that idea because I usually describe ViewModel as “Angular without the boilerplate and ceremonies”

1 Like
333

Viewmodel for React may actually let me give react another try.

But there is still the issue of using coffee-script with react (and Viewmodel is really so much nicer with coffee-script). CJSX works, but I haven’t found a linter that integrates with atom. I know you are into coffee-script. And hints on the web are somewhat sparse and mostly outdated. Any advice?

2 Likes
334

@manuel Any idea when we can expect non-preview release of ViewModel for React? I’m a Blaze fan myself but seeing that even you probably won’t consider Blaze for your next project makes me wanting to reconsider my choices :slight_smile:

1 Like
335

Is ViewModel for React ready to try out?

336

ViewModel for React Alpha :smiley:

337

@M4v3R @aadams

I think it’s ready to use but it’s missing a few things ViewModel for Blaze has:

I will add those soon.

@janmp

I love CoffeeScript but I don’t miss it that much working with ViewModel (or ES6 for that matter).Take the following CJSX as an example:

Time
  showTitle: ''
  time: -> new Date()
  render: ->
    <h1 b="if: showTime, text: time" />

Let’s be honest, that isn’t too far from the JSX version:

Time({
  showTime: true,
  time() {
    return new Date();
  },
  render() {
    <h1 b="if: showTime, text: time" />
  }
})
338

Thanks @manuel.

I have a ton of screens are are just forms (inputs/dates/radio/checkbox controls) with a submit button.

Do you know of any examples of using with forms using your tech?

For example, client side, reactive, validation on the form? Maybe even using your tech with Simple Schema?

I’m trying to move away from Autoform and am thinking of React these days, but wiring up reactive client side validation done right is a real pain.

339

I’m away from my computer but I wanted to point you to some areas of the documentation so you can make a decision.

For what it’s worth, I’ve never felt the need for something like auto forms and plenty of people started using both ViewModel and autoform at the same time and then dropped autoform because they felt they didn’t need it.

Check out the following:
https://viewmodel.org/react#AdvancedValidation
https://viewmodel.org/docs/misc#controls

The gist of it is that you can create your own input controls with all the validation they need.

2 Likes
340

Manuel, it seems that VM doesn’t support global helpers like currentUser or the ones created with registerHelper in bindings:

<template name="binding">
  <input {{b "if: currentUser"}} type="checkbox" > checkbox
</template>

Doesn’t show the checkbox no matter if user logged in or not.
ps. I’m running VM 4.0.14 still…

341

Hi, have you had success with VM and cjsx? I’m struggling with that now.

342

I don’t think cjsx is possible with viewmodel-react because it’s a babel plugin.

@avalanche1

How do you get the value of a global helper from JS?

343

No, have not looked into it. Sticking with Blaze on my current project.

344

What do you mean? currentUser is a Meteor built-in Spacebars helper

345

Yeah but to make {{b "if: currentUser"}} work, I need to get the value from within ViewModel (plain JavaScript), not spacebars.

346

I think I’m doing the same then :slight_smile:

347

Quick question, probably a simple answer.

How could I find items in the scope of regular Template.helpers? For example, how would I get data that regular Blaze would retrieve from Template.instance()?

I’m working with a package that is built for original blaze and is storing some data in helpers, I need to access them from my viewmodel??

348

I honestly have no clue how you can call a template helper without creating a global one. How would you do it without VM?

349

So in the example in the OP, if we had:

Template.greeting.helpers({
  firstName: function() {
    return Template.instance().state.get("firstName");
  }
});

And then we made

Template.greeting.viewmodel({

});

There would be no way to access firstName from the viewmodel?