Mudblazor figma. Controls or Introducing .

Mudblazor figma &nbsp;Use this kit to design/prototype your next Blazor app’s UI in Default Bootst Many DevExpress Blazor components use predefined icons. We started MudBlazor with a simple promise, to empower the developer and fully take advantage of what Blazor offers. At the time, when I played around with the online demos some of the controls did not have the functionality that we were looking for (cannot recall the details now). With MudBlazor you can create exceptional apps without the burden of mastering HTML, CSS and JS and focus your skillset on C#. Mudblazor makes development of standard interfaces a trivial task. Plugins for Code Generation. So changing an icon programmatically is as easy as assigning a new string. Fluent UI: Welcome - FluentUI Blazor Components (fluentui-blazor. figma-to-maui-graphics FigmaSharp. The input is automatically restricted to numeric values and it works regardless of the browser locale settings for decimal types. 2 days ago · Immediate vs Debounced. Jan 21, 2022 · There will be no official MudBlazor UI Kit for Figma. Frontend Development: Implement designs from Figma into MudBlazor components. NET 库，它为 Blazor 应用程序提供了一套丰富的 Material Design 风格的组件。MudBlazor提供了一套完整的组件库，使得开发者能够快速构建美观且功能丰富的用户界面。_mudblazor mudlayout MudBlazor is easy to use and extend, especially for . You can inline MudDialog directly in another component which, of course, makes most sense for small dialogs that are not re-used somewhere else. So, my question is simple. Hello, I’m excited to assist you in converting your Figma design into a Blazor application using the MudBlazor component library. Feb 27, 2024 · I am developing a Blazor Web App using . This is a Figma Community file. Resources. You can read more about theming MudBlazor here. In summary, the choice between Fluent UI Blazor and MudBlazor largely depends on the specific needs of the project. The number of mentions indicates the total number of mentions that we've tracked plus the number of user suggested alternatives. It provides an alternative to designing sites and pages outside of SharePoint. Blazor Component Library based on Material Design. A new AI model to turn Figma designs to high quality code using your Mar 19, 2025 · MudBlazor, while having a smaller community, is growing rapidly. Syncfusion ® offers Figma UI kits to facilitate effective collaboration between designers and developers. MaterialSymbols. MudRadio<T> Component - MudBlazor An option from a set of mutually exclusive options, often as part of a <see cref="T:MudBlazor. Basic Numeric Fields. We won’t just learn about Blazor WebAssembly itself. If you pick a third party, check that it has figma support. &nbsp; Refer to the following DevExpress documentati #mudblazor plugins and files from Figma. Free transparent Sharp Mudblazor Icons vectors and icons in SVG format. You can set fix values for day, month or year via FixDay, FixMonth and FixYear, default value is null for all of them. The ESP32 series employs either a Tensilica Xtensa LX6, Xtensa LX7 or a RiscV processor, and both dual-core and single-core variations are available. Save. NETプログラマには使いやすいです。. MudToolBar Component - MudBlazor To use an icon in your MudBlazor component, you can use the <MudIcon> component and specify the icon using the Icon parameter. Apex Charts definitely works well with MudBlazor. MudBlazor UI Kit: Blazor Component Library by Apr 15, 2021 · PM> Install-Package MudBlazor -Version 5. Breaking changes such as updates to the API, look and feel, or CSS classes, may occur even in minor patch releases. razor file: @using MudBlazor Mudblazor also relies on predefined CSS and fonts, we've to add these references within the index. This project provides icon packs for MudBlazor, leveraging Google's Material Icons and Material Symbols. NET开发者能快速构建Web应用，减少对CSS和JavaScript的依赖。MudBlazor采用C#编写，便于定制和扩展，并配有详细文档和示例。其特点包括易用性、清晰结构和稳定性，适合各类Blazor项目开发。 MudBlazor is easy to use and extend, especially for . ArgTypes should in the majority of cases map to a basic type and appropriate control to change the property. 82 134. The goal is to free the developer from writing JavaScript or CSS. I found every paid libraries to be less flexible, since you pay for a proprietary thing. Card - MudBlazor Represents a block of content which can include a header, image, content, and actions. com> Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users. The UI kit is going to based off of material UI as it is the closest existing system to mudblazor. I have a Figma design consisting of 6-10 pages that needs to be programmed in Blazor C# using the MudBlazor component library without Now that we have MudBlazor configured, let's add some components to our project. As soon as the installation is finished, we must add the required using the directive inside the _Imports. Both are superfine, and well documented. Outlined. For example: < MudIcon Icon =" @MudBlazor. You can also set the DebounceInterval parameter to the number of milliseconds you want to wait before updating the bound value. The documentation is clear and helpful, and the community is active in providing support through forums and GitHub. Is a MudBlazor design system for Figma something you wish existed so you can plan out interfaces faster? - I am not affiliated with MudBlazor, just genuinely contemplating if it's something I should do (I do wish that this exists) and if I would, I'd love to have volunteers to help materialize this The number of mentions indicates the total number of mentions that we've tracked plus the number of user suggested alternatives. NET 8. This guide will demonstrate the setup process for your project, along with detailed explanations of the components, extensions, and functionalities provided. Dec 22, 2022 · 結語. This in combination with the OpenTo parameter allows for Year-Month Pickers, where the user only selects those two values or Month-Day Pickers where the year is already given. mudblazor. The CSS class is bound to the MudBlazor theme and updated if you change the theme dynamicly. Some are built to control the layout of your application, and others may be used to provide other key functions, behaviours and operations for these components. I am new to Figma tool and I would like to create some mockups using mudblazor ui components. NET MAUI Extensions, Advanced UI/UX Controls, and Behaviors to help make your life as a . Graphics turns your Figma design into . I checked out Apex Charts - pretty awesome. Revolutionize your code reviews with AI. Nov 24, 2021 · Standard theme is also available for Figma. Dec 13, 2023 · If there's no MudBlazor-native way to do it, what's the cleanest javascript-y way? UPDATE: We were able to get something working using the ObservableDictionary, where the event handler starts a timer that checks the InputReference each tick, and set focus when it's no longer null (and of course disposes the timer). Using the MudBlazor components, you do not need to know or use CSS, even though you can if you need it. And I can agree with you. Icon Button - MudBlazor Sliced is a powerful admin dashboard template built in MudBlazor with Tailwind CSS framework. MudNavMenu Component - MudBlazor MudBlazor is easy to use and extend, especially for . Palette - MudBlazor The palette is the colors the theme uses for all the components and main layout. What was missing was an easy-to-use yet visually compelling component library. Dec 11, 2023 · In this blog, we will learn how to integrate MudBlazor within the Blazor WebAssembly app, and thus create a Material UI Blazor project. Use this kit to design/prototype your next Blazor app’s UI. The default (SortMode. Sliced comes with dozens of functional designs to help you get started quickly. Jul 27, 2023 · With Blazor App Builder, teams can import a Sketch or Figma design file and transform it to production-ready code for Angular, Blazor, and Web Components (soon for React). Net8 BlazorでMudBlazorが動作しない公式手順でインストールしたが、現バージョン(6. MudBlazor comes with many components of varying functions and behaviours. Numeric fields are just like text fields but work well with numeric values of any type. The theme brings classic yet modern look and feel to Blazor applications. I made some different examples for making charts in Blazor using different free libraries like MudBlazor - Apex - ChartJs and Radzen. With solid experience in Blazor and a strong grasp of Figma to code conversions, I can ensure that your design is faithfully implemented while incorporating interactive elements and animations to enhance user engagement. The <MudDataGrid> allows you to either disable sorting entirely, sort by single column or by multiple columns via the SortMode property. Although my timing was terrible! I tried out Apex Charts in a standalone Blazor app - everything worked fine. Display an element based on the current viewport. html file: Blazor Component Library based on Material Design. Conclusion. NET MAUI Community Toolkit is a community-created library that contains . TheodoreTsg TheodoreTsg. The plan is to have them put there spin on components as far as color, type, spacing and small things like that. With a wi MudBlazor is easy to use and extend, especially for . Is there any way that I could find or import the mudblazor ui components into a PatternMask < MudTextField > can be configured to apply rules to the user input by setting its Mask property. Plugins in Dev Mode can extend Figma's native code snippets to generate code for languages or frameworks that Figma doesn’t support, or to surface metadata that a front-end developer might find useful when implementing a design in code (e. 15K subscribers in the Blazor community. Multiple) allows sorting on more than one column (Hold Ctrl-Key) while clicking on a header column to extend the sort operation to another column. Here we are going to start with installing MudBlazor, creating a project with it, and importing it Jul 13, 2024 · In general, we don't mind if MudBlazor had support for tools like Figma, Penpot, and similar tooling as long as there is someone from the community who is willing to work on it and maintain it, similar to what is happening with MudBlazor Translation here. MudBlazor has been great so far, better than Radzen. 2. It's an excellent place to get started with MudBlazor. The MudBlazor. ThemeManager dotnet add package MudBlazor. com snipped that shows your problem. 0)は動作しませんでしたこの対処… Apr 23, 2024 · What is MudBlazor? MudBlazor is an open-source UI library for Blazor, a web development framework that allows you to build modern, interactive web applications using C# and Razor syntax. It is added at the top of the list of items. Fixed Values Usage. Enregistrer. MudTable<T> Component - MudBlazor A sortable, filterable table with multiselection and pagination. For enterprise applications requiring Compare figma-to-maui-graphics vs MudBlazor and see what are their differences. Feb 22, 2025 · Add the MudBlazor package via NuGet dotnet add package MudBlazor I will also be wanting the theme library, so also add the NuGet package MudBlazor. When you get familiar w/ documentation(s). Maui The . NET. The nested lists inherit all settings of the top-level list. Its focus is ease of use and clear structure. I have a Figma design consisting of 6-10 pages that needs to be programmed in Blazor C# using the MudBlazor component library without Sorting. Boost productivity and code quality across all major languages with each PR. We would like to show you a description here but the site won’t allow us. We are dedicated to improving every aspect of MudBlazor to be your number one choice when looking for a Blazor component library. Action Movies & Series; Animated Movies & Series; Comedy Movies & Series; Crime, Mystery, & Thriller Movies & Series; Documentary Movies & Series; Drama Movies & Series Which is the best alternative to figma-to-maui-graphics? Based on common mentions it is: MudBlazor, CommunityToolkit/Maui, AlohaKit. Browse SVG vectors about Mudblazor Icons term. This UI Kit contains Figma components that replicate DevExpress Blazor Controls in the default Bootstrap color scheme. 0 and Server as Interactive render mode. Maui. We are not a company, and there is no large organization behind MudBlazor, so we don't have the resources to develop and continuously maintain a Figma. To do it, just drag and drop your Sketch file into the “Create from existing design” area. NET Multi-platform App UI (MAUI) Each palette color gets converted to a class with the color as background and its contrast, but also separate classes for only background or text color. These kits match the themes used in Syncfusion ® controls. Sep 25, 2024 · 文章浏览阅读1. For more details on how to May 25, 2023 · MudBlazor is a Material Design component library for Blazor. com> * MudToolBar: Optional Wrapping and Appbar compatibility (MudBlazor#6869) * Added Parameter Wrapping to MudToolBar * Fixed Documentation naming from Appbar to ToolBar * Added Wrapping Parameter to AppBar. Adornment Enumeration - MudBlazor Jun 30, 2023 · Table 1 Blazor UI Component Libraries. I think the idea behind this library is that you can design a UI in figma using design elements that correspond to Radzen components. NET MAUI Graphics code (by jsuarezruiz) Dec 10, 2024 · MudBlazor is a powerful UI component library for Blazor, which allows developers to build responsive and interactive web applications using C# and . Each icon is available in black-and-white and color versions. Custom SVG Icons. MudBlazorは、数あるBlazor用のUIフレームワークの一つです。 C#でコントロールしやすいように作られていて、. Nov 5, 2021 · Thanks for the explanation - I understand. The Widget Code Generator plugin for Figma design allows you to design widgets and easily translate your designs into code. I don't think that there's any way to automatically convert a Figma design to Blazor code. Compare Maui vs figma-to-maui-graphics and see what are their differences. Then it will seem as if sizing columns doesn't work. net) Ant Design: Ant Design of Blazor - Ant Design of Blazor (antblazor. 1 5. According to my idea, the developer focuses on these properties in order to bring the Figma layout closer to implementation. Explore, install and use files and plugins on Figma Community. where to import icons in a codebase or internationalization string extraction). However, sometimes I find myself hijacking component styles using ::deep to make them do what I want. However, I have noticed Figma design libraries like this one for Radzen components. Globals - MudBlazor A collection of settings that let you control the default behavior or appearance of MudBlazor components. - AaronCrvl/ForumWars This is why I currently rewrite an app using MudBlazor, to avoid the ever changing UI frameworks. d-md-none will only apply to md and up. Typography - MudBlazor Typography controls the text throughout the theme, like font-family, size, and other settings. Live demo. Needless to say we don't There are grid controls from the usual commercial vendors like Radzen and Telerik. MudChart Component - MudBlazor Represents a graphic display of data values in a line, bar, stacked bar, pie, heat map, or donut shape. That means . Free transparent Mudblazor Icons vectors and icons in SVG format. They're slippery as hell. Community is a space for Figma users to share things they create. Check Box - MudBlazor Represents a form input for boolean values or selecting multiple items in a list. Blazor Component Library based on Material Design principles with an emphasis on ease of use and extensibility - MudBlazor/MudBlazor Default Table. To create a nested list with multiple levels of nesting use the < NestedList > render fragment of the < MudListItem >. ThemeManager In index. This kit includes a collection of customizable components such as buttons, cards, and forms, all adhering to Material Design principles. To add a MudBlazor component, open the Pages/Index. The DevExpress Blazor component suite allows you to apply Bootstrap themes to your applications. HTML is an established standard and won't go away any time soon, the only things I need MAUI for, are the platform specific services. So out of those Mudblazor. Basic Layout. Material has one which is good for mobile. Get started with a free account → MudBlazor is easy to use and extend, especially for . FontIcons. 580 3 3 gold badges 11 11 silver badges 29 29 bronze They are going to create a UI kit in figma to match mudblazor. This UI Kit contains Figma components that replicate DevExpress Blazor components in the Blazing Berry theme. Exactly the same properties are present in the Radzen documentation, only they are called: Size, ButtonStyle, Shade. The same breakpoint classes apply from the bottom up. MudRadioGroup`1" />. Database " > </ MudIcon > Forum app made with Blazor Server (. For T, use either IBrowserFile for a single file or IReadOnlyList<IBrowserFile> for multiple files. razor 14 votes, 15 comments. ESP32 is a series of low cost, low power system on a chip microcontrollers with integrated Wi-Fi and dual-mode Bluetooth. d-none applies to all breakpoints, but . The advantage is that you can easily share code and data between dialog and owning component via bindings. Differences between free and paid Blazor UI Component Libraries often include: Component availability. Figma does not build the pages in SharePoint, so once you finalize a design in Figma, you will need to build it in SharePoint. I added the Charts to my MudBlazor project - many errors appeared. Dec 19, 2023 · . Size can be directly set on the image with the Width and Height property, it can also be useful to set this even if you want a responsive image, setting them will make the image take up set space even before they are loaded which can be useful if your pictures takes long time to load. ʟɪᴋ ᴍɪɴɢ se abre en una pestaña nueva. NET SSR) and Razor pages. MudBlazor looks good, but I did our evaluations about a year ago. 4k次，点赞20次，收藏7次。MudBlazor 是一个开源的 . Dec 17, 2023 · Using "Filled Buttons" as an example. The text for this option can be customized by the SelectAllText parameter. Developers love to work with MudBlazor. Chat - MudBlazor The MudChat component is used to house one or more MudChatBubble components, with optional components such as MudAvatar, MudChatHeader, and MudChatFooter. razor file and add the following code: MudBlazor is easy to use and extend, especially for . Learn how to install, integrate and configure CKEditor 5 Builds and how to work with CKEditor 5 Framework, customize it, create your own plugins and custom editors, change the UI or even bring your own UI to the editor. About Radzen Radzen is a desktop tool that gives you the power to create line of business applicat Is there a figma file for MudBlazor atm? The look and feel is quite similar to other Material but still some custom stuff that would make a unique Figma file worthwhile. It provides a collection of pre-built UI components that adhere to the Material Design guidelines, making it easier to create visually appealing and responsive user interfaces. github. I used them briefly during a free trial. You can also use Figma to test and preview any color adjustment you might want to make to the Standard theme in a Radzen Blazor app. NET 8のBlazor Web Appに移行した際に、MudBlazorを調整した記録です。 MudBlazor とは. Providing developers with a comfortable way to produce awesome-looking UIs for their customers out of the box would make working with Blazor an even more enjoyable task. Select All. If you set SelectAll="true", you can display a 'Select all' option to select or deselect all items. Each MudDropZone has a unique settable Identifier that is used to determine what item should be placed in what dropzone. BUURGER EMAIL DESIGN|FIGMA EMAIL DESIGN| KLAVIYO EMAIL| There are grid controls from the usual commercial vendors like Radzen and Telerik. CodeRabbit offers PR summaries, code walkthroughs, 1-click suggestions, and AST-based analysis. BUURGER EMAIL DESIGN|FIGMA EMAIL DESIGN| KLAVIYO EMAIL| Multiple Owners. As I am working on the frontend, I am using MudBlazor as my components library and I want to use FluentUI comp First step: MudBlazor as a component library . Set Immediate="true" to update the value whenever the user types. In this article, I will walk you through an example of creating a login page using MudBlazor. Please use it only if you are prepared to adapt your code accordingly and provide feedba MudBlazor是一个为Blazor开发设计的Material Design组件框架。该框架提供丰富的UI组件，让. Transition Enumeration - MudBlazor These don't seem comparable, bootstrap is a CSS library, Fluentui are html controls, mudblazor is a massive connection of Blazor components. I'd rather focus on current issues. 29 Nov 2024 3 minutes to read. 1 comment. So my 2 goto libraries are MudBlazor d Radzen. Nov 29, 2024 · Figma UI Kits for Syncfusion ® Controls. MudBlazor 本身的官方文件寫得清楚易懂，還有提供線上遊樂場來做一些簡單快速的小實驗，相當貼心。 說明文件的品質是我挑選第三方元件庫的主要考量之一。 Warning: This component is currently under development. MudBlazor UI Kit: Blazor Component Library. 6. Controls or Introducing . MudBlazor comes with a wide range of components, from buttons and cards to more complex elements like data grids and dialogs. MudBlazor UI Kit – Blazor Component Library for Figma. Compare MudBlazor with alternative projects. Discuss code, ask questions & collaborate with the developer community. The idea is to provide templates that range from a basic layout to more advanced application setups. View features, pros, cons, and usage examples. Nested List. Welcome to the MudBlazor Icons repository. NET devs because it uses almost no Javascript. g. 0. I have a Figma design consisting of 6-10 pages that needs to be programmed in Blazor C# using the MudBlazor component library without MudBlazor is easy to use and extend, especially for . In this repo you will find project templates for Blazor built with just MudBlazor. MudBlazor contains more than 50 controls and comes with theming support. To create a file upload button, two elements are needed: an activator (using the ActivatorContent parameter) and an input. Stars - the number of stars that a project has on GitHub. BUURGER EMAIL DESIGN|FIGMA EMAIL DESIGN| KLAVIYO EMAIL| Plusieurs propriétaires. Could be a nice commercial addon to generate money perhaps? The DevExpress Blazor component suite ships with a set of built-in themes. 11. By default, MudTextField updates the bound value on Enter or when it loses focus. Nov 17, 2023 · . Provide the MudDropContainer with a selector function (Func<T, string, bool>) for the property ItemSelector to place the items correctly. Note: Make sure to upgrade the MudBlazor nuget references to the newest version! I'm thinking along the lines of pulling in a component library like MudBlazor and automatically creating stories for each component that you can tweak. It has a funny name, but MudBlazor [1] has been the MIT licensed library I have been using lately. Improve this question. Up-to-date Figma versions of the Telerik and Kendo UI libraries that designers can use to visually manipulate the UI components. Ensure responsive layouts for mobile, tablet, and desktop, adhering to the mobile-first design principles. Inlining Dialog. PHP & HTML Projects for €30-250 EUR. #mudblazor plugins and files from Figma. ThemeBuilder A powerful cloud application and Figma plugin that simplifies applying UI customizations without the need to write complex CSS. For example, you’ll find such icons in series legend items in a Chart, or expand buttons in an Accordion or TreeView control. Free download Mudblazor Icons SVG Icons for logos, websites and mobile apps, useable in Sketch or Figma. Autocomplete - MudBlazor Represents a component with simple and flexible type-ahead functionality. Ladybug APP Design. For more details on how to use the Material Icons in your MudBlazor project, please refer to the Material Icons Usage Guide. Post. This Figma plugin generates code that you can copy and use to create a widget interface. The MudBlazor team is small and consists of enthusiasts, each with their own area of interest. Default Table. - Proposed Approach: 1. The Radzen team is happy to share with the community a new Standard theme for our free set of Radzen Blazor UI components. Jun 30, 2023 · mudblazor; figma; Share. Xs unless changed. My expertise includes integrating multilingual support, optimizing PWAs, and adhering to deadlines with version-controlled workflows. NET MAUI developer easier (by CommunityToolkit) MudBlazor is growing quickly. MudComponentBase Class - MudBlazor MudBlazor is easy to use and extend, especially for . Personally preferring mudblazor because of easier time theming and components being driven by parameters instead of fragments. API reference and examples included. The only thing is - both are super SEO unfriendly. Jul 19, 2022 · @HammadAhmi you will have to share a try. 💹 To Do list : Write this readme MudBlazor is easy to use and extend, especially for . We were using both MudBlazor and Radzen. Join us and be part of the library’s success! I have a Figma design consisting of 6-10 pages that needs to be programmed in Blazor C# using the MudBlazor component library without database access Key Requirements: - Convert Figma design to Blazor - Implement a few interactive elements and animations - Incorporate basic user authentication features (login/signup) Ideal Skills: - Proficiency Drop Item Selector. You can duplicate and use the Components Library to quickly create design mockups via drag & drop. Net8で動作しました(2023年11月17日). MudIcon Component - MudBlazor MudBlazor is easy to use and extend, especially for . Add the DataLabel property to your MudTd cells to properly display the column label when the table has changed to mobile layout. Extensions is a convenient package that extends the capabilities of the MudBlazor component library. office has one for the online office look (though it has better react support than plain html), there are 3rd part components with their own css libraries. Several people volunteered to create one, but in the end, no progress was made in that direction. Paid libraries typically offer a broader range of Visibility. Get started with a free account → . &n Explore the GitHub Discussions forum for MudBlazor MudBlazor. Size. The easiest to use Mask is the PatternMask which allows you to specify the input structure with a simple pattern consisting of pre-defined mask characters. Feb 23, 2023 · Signed-off-by: dependabot[bot] <support@github. In Figma, this button has unique properties: Size, Style, Shade. In order to add interactivity to your widget, you’ll need to edit the generated cod Mar 22, 2022 · This is the beginning of a new MudBlazor tutorial series. &nbsp; This library contains such predefined icons. Looks like a great project though and it seems to be gaining momentum in the community. The MudBlazor UI Kit: Blazor Component Library is an unofficial Figma resource tailored for designers building modern web applications with the MudBlazor component library. The default table displays your data in simple rows and is responsive, it breaks into mobile layout on Breakpoint. For more details on how to MudBlazor UI Kit – Blazor Component Library for Figma. The Standard theme UI kit is freely available on Figma Community here. Follow asked Jun 30, 2023 at 14:37. html we need to add a couple of links, so after the link to your application’s styles add the following Dec 10, 2022 · The typical Microsoft one is bootstrap. . Not used any commercially licensed Blazor libs though. Free transparent Glyph Mudblazor Icons vectors and icons in SVG format. I found every non paid libraries to lack content. noreply. com) If you use other please let me know! I want a recommendation for my next project. The Figma UI kits are available in four themes: Material 3, Fluent, Tailwind, and Bootstrap 5. Some table content can restrict sizing if you want to make the columns narrower than the minimum width of the content it contains. The icon parameter of < MudIcon >, < MudButton > and other components are just SVG strings. […] Feb 27, 2024 · Why use the Figma SharePoint Web UI kit? Figma is a subscription-based application that is the industry standard tool for web design. MudBlazor: MudBlazor - Blazor Component Library. NET 7のBlazor Serverアプリを、. Aug 6, 2021 · My plugin is always running into “memory access out of bounds” error, what can I do to reduce memory usage without killing features ? Thanks. File Upload A form component for uploading one or more files. A. We are growing every day, developers from all over the world are using MudBlazor and are engaged with the community. MudBlazor is easy to use and extend, especially for . xlnqt xjzvx rhtj vbwg xqoax jqyl gpkt wqksqgm oyjiyrx qoi fojgy iurwr hyr kjovxr mjd