Wasp-lang•3w ago

multiple features

Hi is it possible to create multiple pages for custom features with this boilerplate? Couldn’t acces internet so trying to figure out through this way. Thanks alot

24 Replies

kapa.ai•3w ago

Hi @Sven. I'm kapa.ai, your friendly support bot. I will try to answer your question by searching through the knowledge base. :wave: ---------------------- Yes, it is possible to create multiple pages for custom features with Wasp. You can add more pages by creating another set of page and route declarations. Here is an example of how to add a new page:

main.wasp
route HelloRoute { path: "/hello/:name", to: HelloPage }  
page HelloPage {  
 component: import { HelloPage } from "@src/HelloPage"  
}

main.wasp
route HelloRoute { path: "/hello/:name", to: HelloPage }  
page HelloPage {  
 component: import { HelloPage } from "@src/HelloPage"  
}

When a user visits /hello/their-name, Wasp will render the component exported from src/HelloPage.tsx and pass the URL parameter the same way as in React Router:

src/HelloPage.jsx
export const HelloPage = (props) => {  
 return <div>Here's {props.match.params.name}!</div>  
}

src/HelloPage.jsx
export const HelloPage = (props) => {  
 return <div>Here's {props.match.params.name}!</div>  
}

You can visit /hello/johnny and see "Here's johnny!". For more details, you can refer to the Wasp documentation (https://wasp-lang.dev/docs/tutorial/pages#adding-a-second-page). ---------------------- Note: you can ask me a follow up question by @ mentioning me again :speech_balloon: ---------------------- Sorry @Sven, I seem to be having a bit of trouble. Don't worry though, I've pinged my support and they will try to fix me up! :technologist: Perhaps try again in 15mins?

Sven•3w ago

Ahhh cool How would i learn more about jsx and tsx to make such pages?

Anddy•3w ago

The best thing I’ve done is watch YouTube videos. Params can be very powerful when used correctly

Sven•3w ago

Do you have some links

miho•3w ago

Any React tutorial will be okay, JSX / TSX as keywords help. These tutorials are usually related to using React outside of Wasp so you'll need to slightly adjust what you learn but ever so slightly becauase Wasp is using good old React, and no special syntax. For example: https://www.youtube.com/watch?v=xTVQZ46wc28

Dave Gray

YouTube

React Typescript Tutorial for Beginners

Web Dev Roadmap for Beginners (Free!): https://bit.ly/DaveGrayWebDevRoadmap In this React Typescript Tutorial for beginners you will learn about function components, passing props, default values, passing setState, and all of the associated TS types and return types. React + Typescript! 🚀 Become a full-stack web dev with Zero To Mastery Course...

Sven•3w ago

alright nice is this boilerpalte suited for like "bigger" projects. Planning on building something big have a good experience in different coding languages and frameworks btw what would be recommended to use JS or TS?

miho•3w ago

@Vinny (@Wasp) I'll let you answer this bit

Sven•3w ago

alright ill try

miho•3w ago

TS all the way in my opinion, it's not that harder but gets a lot of benefits by catching potential bugs for you

Sven•3w ago

yeah true object oriented is better too imo how do i install wasp on my windows machine

miho•3w ago

Have you checked the Wasp docs? https://wasp-lang.dev/docs

Introduction | Wasp

If you are looking for the installation instructions, check out the Quick Start section.

Sven•3w ago

yes but i dont understand the scentence To install Wasp on Linux / OSX / WSL (Windows), open your terminal and run:

miho•3w ago

Boris wrote this great post on the topic of installing Wasp on Windows (WSL2): https://dev.to/wasp/supercharge-your-windows-development-the-ultimate-guide-to-wsl-195m

DEV Community

Supercharge your Windows Development: The Ultimate Guide to WSL 🚀📟

Hi! I’m Boris! I’m a software engineer working professionally in insurance, teaching other...

Sven•3w ago

but do i need to code in a linux env or something then

miho•3w ago

Please read the article 🙂 it will clear up things in much better way than I can in a few short messages

Gaming

Programming

multiple features