Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Empty Blazor WebAssembly Project Template #42215

Merged
merged 42 commits into from
Jun 22, 2022

Conversation

cerasamson
Copy link
Contributor

This creates an empty Blazor WebAssembly project template that contains minimal HTML/CSS formatting and no demo code or authentication options.

Screenshot of the current template:
image

Fixes #32832

@cerasamson cerasamson added area-mvc Includes: MVC, Actions and Controllers, Localization, CORS, most templates area-blazor Includes: Blazor, Razor Components feature-templates labels Jun 15, 2022
@cerasamson cerasamson added this to the 7.0-preview6 milestone Jun 15, 2022
@cerasamson cerasamson requested a review from Pilchie as a code owner June 15, 2022 18:59
@TanayParikh TanayParikh requested a review from a team June 15, 2022 20:23
Copy link
Contributor

@TanayParikh TanayParikh left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Looking great so far; left a few comments.

Also, we can remove the database:

src/ProjectTemplates/Web.ProjectTemplates/content/EmptyComponentsWebAssembly-CSharp/Server/app.db


.blazor-error-boundary::after {
content: "An error has occurred."
}
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

If we're having the error styling, should we also have minimal styling for forms validation errors?

.valid.modified:not([type=checkbox]) {
    outline: 1px solid #26b050;
}

.invalid {
    outline: 1px solid red;
}

.validation-message {
    color: red;
}

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I believe we wanted to eliminate as much CSS styling as possible, and the error styling was only kept as it was being used in \Client\wwwroot\index.html. The form validation styling was removed since it wasn't used in any of the existing code, but it can be added back to both templates.

<p role="alert">Sorry, there's nothing at this address.</p>
</LayoutView>
</NotFound>
</Router>
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Is the intent to support auth with this template? I don't personally mind either way about that, but if we are supporting auth, then I think there will also need to be an auth-enabled version of this file which uses AuthorizeRouteView. The non-empty template contains an example of this.

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Is the intent to support auth with this template?

Spoke with Dan regarding this earlier, and the conclusion was the empty template does not need to support auth.

@SteveSandersonMS
Copy link
Member

SteveSandersonMS commented Jun 15, 2022

@cerasamson This is looking really great! I'm definitely looking forward to having this template. No doubt customers will appreciate it a lot too.

Minor question: I noticed there's a file app.db. Is that meant to be there? I'm not sure what it's for.

And are we missing csproj files, or do they go somewhere else?

@SteveSandersonMS
Copy link
Member

SteveSandersonMS commented Jun 15, 2022

Here's a slightly controversial thought: we don't really need to have any "layout" in this template. We could just eliminate the MainLayout.razor file, and then developers would put whatever cross-page common UI they want in either index.html or App.razor. There isn't strictly any need for a 3rd choice of where to put common UI. Layouts as a feature are only relevant if you want different pages to have different layouts.

@danroth27 Interested to know if you have a view on this. In your experience, do people need layout components, and do you think they would struggle to add a "layout" component later if the project template didn't start with one?

Update Actually on further consideration, having this one extra very simple MainLayout.razor file doesn't really increase the conceptual complexity in any significant way, so I'd probably err on the side of keeping it in. The whole thing is still pretty elegant with or without it.

@cerasamson
Copy link
Contributor Author

@SteveSandersonMS Thank you for the feedback! 😄

app.db was in the directory when I duplicated the original ComponentsWebAssembly-CSharp folder. I don't think it is being used in this template and will be removed.

The csproj files have not been added yet. They will be placed in the parent directory.

{
"$schema": "http://json.schemastore.org/dotnetcli.host",
"symbolInfo": {
"skipRestore": {
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Just confirming whether you've had a chance to test out these options on the CLI? Notably, the Hosted option is working appropriately (ie. creating empty blazor hosted vs empty blazor standalone).

…ntsWebAssembly-CSharp/Client/wwwroot/manifest.json

Co-authored-by: Tanay Parikh <TanayParikh@users.noreply.github.com>
Copy link
Contributor

@TanayParikh TanayParikh left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Looks great! 🚢 it!

@TanayParikh TanayParikh requested a review from phenning June 21, 2022 23:16
@TanayParikh TanayParikh requested a review from phenning June 21, 2022 23:53
Copy link
Contributor

@phenning phenning left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

LGTM now. Thanks!

Caused /Server build to fail
@cerasamson cerasamson merged commit 4baffff into dotnet:main Jun 22, 2022
@cerasamson cerasamson deleted the t-samsoncera/empty-wasm branch June 22, 2022 22:34
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
area-blazor Includes: Blazor, Razor Components area-mvc Includes: MVC, Actions and Controllers, Localization, CORS, most templates feature-templates
Projects
None yet
Development

Successfully merging this pull request may close these issues.

Empty Blazor project template
4 participants