How to use the @dojo/framework/widget-core/d.w function in @dojo/framework

protected render() {
		const webAnimation = this.meta(WebAnimation);
		webAnimation.animate('zombieOne', this._getZombieAnimation('zombieOneShuffle', 'left'));
		webAnimation.animate('zombieTwo', this._getZombieAnimation('zombieTwoShuffle', 'right'));
		webAnimation.animate('zombieOneBody', this._getZombieBodyAnimation('zombieOneBody'));
		webAnimation.animate('zombieOneBackLeg', this._getZombieLegAnimation('zombieOneBackLeg'));
		webAnimation.animate('zombieOneFrontLeg', this._getZombieLegAnimation('zombieOneFrontLeg', true));
		webAnimation.animate('zombieTwoBody', this._getZombieBodyAnimation('zombieTwoBody'));
		webAnimation.animate('zombieTwoBackLeg', this._getZombieLegAnimation('zombieTwoBackLeg'));
		webAnimation.animate('zombieTwoFrontLeg', this._getZombieLegAnimation('zombieTwoFrontLeg', true));

		return v('div', { classes: css.root }, [
			v('div', { classes: css.controls }, [
				w(Slider, { min: 0.1, max: 10, step: 0.1, value: this._zombieLegsPlaybackRate, onInput: this._onZombieLegsPlaybackRateChange })
			]),
			v('div', { classes: css.zombieOne, onclick: this._onZombieClick, key: 'zombieOne' }, [
				v('div', { classes: css.zombieOneBody, key: 'zombieOneBody' }),
				v('div', { classes: [ css.zombieOneLeg, css.zombieOneBackLeg ], key: 'zombieOneBackLeg' }),
				v('div', { classes: [ css.zombieOneLeg, css.zombieOneFrontLeg ], key: 'zombieOneFrontLeg' })
			]),
			v('div', { classes: css.zombieTwo, onclick: this._onZombieClick, key: 'zombieTwo' }, [
				v('div', { classes: css.zombieTwoBody, key: 'zombieTwoBody' }),
				v('div', { classes: [ css.zombieTwoLeg, css.zombieTwoBackLeg ], key: 'zombieTwoBackLeg' }),
				v('div', { classes: [ css.zombieTwoLeg, css.zombieTwoFrontLeg ], key: 'zombieTwoFrontLeg' })
			]),
			v('div', { classes: css.heartsHolder }, this._getHearts())
		]);
	}
}

rows: 3
										})
									]),
									v('div', { classes: 'card-footer' }, [
										v('img', { classes: 'comment-author-img', src: '' }),
										v(
											'button',
											{ onclick: this._addComment, classes: ['btn', 'btn-sm', 'btn-primary'] },
											['Post Comment']
										)
									])
								])
							: v('p', [
									w(Link, { to: 'login' }, ['Sign In']),
									' or ',
									w(Link, { to: 'register' }, ['Sign Up']),
									' to add comments on this article.'
								]),
						v('div', comments.map((comment: CommentItem, index: number) => {
							return w(Comment, {
								key: index,
								comment,
								loggedInUser,
								deleteComment,
								slug: article.slug
							});
						}))
					])
				])
			])
		]);
	}

protected render() {
		return [
			v('h1', { title: 'I am a title!' }, [ 'Welcome To Biz-E-Bodies' ]),
			v('label', ['Find a worker:']),
			w(List, {
				onInput: this.filterData,
				value: '',
				data: this._data || this.properties.data
			})
		];
	}
}

label: 'Last Name',
					labelHidden: true,
					placeholder: 'Last name',
					value: lastName,
					required: true,
					onInput: this.onLastNameInput
				})
			]),
			w('dojo-text-input', {
				label: 'Email address',
				type: 'email',
				value: email,
				required: true,
				onInput: this.onEmailInput
			}),
			w<button>('dojo-button', { }, [ 'Save' ])
		]);
	}
}</button>

protected render() {
		return v('div', [
			w(HeaderContainer, {}),
			w(Outlet, {
				id: 'login',
				renderer: () => {
					return w(LoginContainer, {});
				}
			}),
			w(Outlet, {
				id: 'register',
				renderer: () => {
					return w(RegisterContainer, {});
				}
			}),
			w(Outlet, {
				id: 'user',
				renderer: (details: any) => {
					if (details.isExact()) {
						return w(ProfileContainer, { type: 'user', username: details.params.username });
					}
				}
			}),
			w(Outlet, {
				id: 'favorites',
				renderer: (details: any) => {

protected render() {
		return v('div', [
			v('ul', [
				v('li', [w(Link, { key: '1', to: 'about-us' }, ['About Us (Static)'])]),
				v('li', [w(Link, { key: '2', to: 'company' }, ['Company (Static)'])]),
				v('li', [w(Link, { key: '3', to: 'user', params: { user: 'kim' } }, ['Kim (dynamic)'])]),
				v('li', [w(Link, { key: '4', to: 'user', params: { user: 'chris' } }, ['Chris (dynamic)'])])
			]),
			w(Outlet, {
				outlet: 'about-us',
				renderer: () => {
					return w(About, {});
				}
			}),
			w(Outlet, {
				outlet: 'company',
				renderer: () => {
					return w(Company, {});
				}
			}),

		const workers: DNode[] = workerData.map((worker, i) => w(Worker, {
			key: `worker-${i}`,
			...worker
		}));

const r = renderer(() => w(App, {}));
r.mount({ domNode: document.querySelector('my-app') as HTMLElement });

renderer: (details: any) => {
					if (details.isExact()) {
						return w(Home, {});
					}
				}
			}),

label: 'Last Name',
					labelHidden: true,
					placeholder: 'Last name',
					value: lastName,
					required: true,
					onInput: this.onLastNameInput
				})
			]),
			w(TextInput, {
				label: 'Email address',
				type: 'email',
				value: email,
				required: true,
				onInput: this.onEmailInput
			}),
			w(Button, { }, [ 'Save' ])
		]);
	}
}