Topic Idea: Server Side Validation and Client Side Validation in WordPress

[utsavtilava]

Details

• Topic description: Server-Side Validation and Client-Side Validation in WordPress
• Learning objectives:
  Understand the importance of server side validation and client side validation in WordPress.
• Content type: Text
• WordPress version (optional):
• Will you be creating this content?: Yes

Related Resources

Links to related content on Learn, HelpHub, DevHub, GitHub Gutenberg Issues, DevNotes, etc.

Vetting Checklist for SMEs

Please follow the team handbook: Vetting topic ideas.

• Set a Priority label
• Assess topic details, and provide feedback as necessary.
• Move issue to "Vetted Topics" status

[utsavtilava]

I have attached my content here :
https://docs.google.com/presentation/d/1UKi7EdS17mxyAidBsQ8X3M7oZ8naDz2s-d4QiGl_s34/edit?usp=sharing

[kaitohm]

I see you've submitted some slides here, @utsavtilava . We don't have slide-only content on Learn.WordPress.org right now. The closest content types would be either:

• Online Workshop (live workshop via zoom), or
• Tutorial (recorded 5-10 minute video)

Do you have a preference with which type of content to turn this into? We can also assign an experienced content creator to work along side you, if you'd like. Let us know what you think.

[utsavtilava]

Hello @bsanevans

Thank you for reviewing the content I submitted. I apologize for the misunderstanding regarding the content type on Learn.WordPress.org. I appreciate your clarification.

Considering the options you provided, I believe converting the slides into a recorded tutorial video would be the most suitable format for the content. This way, viewers can follow along and learn at their own pace.

Please let me know how you would like to proceed, and If you want i will share the content with you, So i will share it in a single document file. Once you confirm, I will be ready to review and provide feedback on the content you've created specifically regarding server-side and client-side validation.

[utsavtilava]

And also, @bsanevans , could you please share a reference URL on how to structure content using? This would be helpful for me to ensure consistency in my writing.

[kaitohm]

@utsavtilava Here are the steps for creating a Tutorial: https://make.wordpress.org/training/handbook/tutorials/creating-a-tutorial/ You will also find other resources about making a Tutorial in the team handbook:

If you haven't done so yet, then you'll want to start by submitting a tutorial presenter application.

I've also reached out for experienced Subject Matter Experts and Content Creators to assist with the creation in this Slack thread: https://wordpress.slack.com/archives/C02RW657Q/p1686291641083529

[kaitohm]

Next steps for SMEs

Please follow the team handbook "Vetting topic ideas" to vet this topic.

[jonathanbossenger]

Hi @utsavtilava I think this would make a great topic for either an online workshop or a tutorial, or even both.

One comment I do have is that I notice in your slides you don't have any specific examples of Server-Side or Client-Side Validation in WordPress. I think adding some code examples to the content would be really helpful, as it would show folks how to implement the theory in the real world.

[utsavtilava]

Hello @jonathanbossenger

Thank you for your feedback.

Can you please check again, I have attached example slides in sheet.

[jonathanbossenger]

Hi @utsavtilava I'm not sure if I am looking at the correct slides, but I don't see any code examples in the slides linked above (this is the URL I am looking at: https://docs.google.com/presentation/d/1UKi7EdS17mxyAidBsQ8X3M7oZ8naDz2s-d4QiGl_s34/edit?usp=sharing)

[utsavtilava]

Hello @jonathanbossenger

I have atteched both screenshot which i am added in slide. Can you please have a look into this.
Let me know if you have any question or changes.

Server Side Validation :

Client Side Validation :

[jonathanbossenger]

Hello @utsavtilava

Thanks for the update. What I was hoping for was more detailed example code using the core WordPress functions & APIs, HTML attributes, and JavaScript functions you are describing, which relate to the content in the slides.

Below are some examples of what I'm looking for when I review this presentation:

• In slide 3 you talk about some of the sanitization functions like sanitize_text_field or sanitize_email. It would be useful to show an example of how these functions would work.
• In slide 5 you talk about some of the possible validation functions like is_email. Again, it would be useful here to show an example of how this function works.
• In side 10 you talk about HTML form field validation using HTML5 form validation attributes. It would be useful here to show how they are applied to a form field, and then what happens on the form when it is rendered.
• In slide 11 you talk about JavaScript Validation, it would be great if you could include a code snippet of what this could look like, and how you validate the data in JavaScript.

So the content in the slides is the theory behind these topics, but to really help the learner understand what you are presenting, it would be great if you could show some actual examples of the functionality you are describing.

Given that you are planning to convert the slides into a recorded tutorial video, it might be easier to do this in a text or markdown format, where you can include these code examples to go along with the theory.

I also note that for your Server Side Validation example, you have linked to a jQuery Validation Plugin, but this is client-side validation. It even says it on the site "This jQuery plugin makes simple clientside form validation easy".

Last note, If you can, I would include both plain JavaScript solutions as well as jQuery-based ones. Many developers are moving away from using jQuery. Plain JavaScript currently can do much of what we used to need jQuery for so if it's possible without jQuery, I would show that as well.

[Piyopiyo-Kitsune]

Is server side / client side validation a topic that will come up in a developer learning pathways @jonathanbossenger ?

[jonathanbossenger]

Most, if not all, of this content, is covered in module 9 of the beginner developer learning pathway, so I think it's safe to close this out for now.

If we get new information we want to use to add lessons to that module, we can create new issues for that.