12/26/2023 0 Comments Phoenix liveview form![]() ![]() Discussing all features of gettext is outside of the scope of this article, but you may find full documentation online. It is used to create multilingual systems (not only web applications) by many developers and companies, so you may find lots of materials about it on the net. So, gettext is a complex open-source solution created by GNU (initially it was introduced by Sun Microsystems in the middle 90s). The source code for this article can be found on GitHub. If you would like to run the code samples presented in this article locally, you'll need to install OTP (at least 18), Elixir (at least 1.4) and, of course, the Phoenix framework itself (version 1.3 will be used in this tutorial). I will also talk about supporting multiple locales, pluralization rules, and domains. You will learn what gettext is, what PO and POT files are, how to generate them, and easily extract translations from your views. I'll walk you through how to add support for i18n in Phoenix applications with the help of gettext (which is a default dependency). In this article, you will learn about Phoenix i18n. ![]() It has many features that should be familiar to developers who come from the Rails or Django world, but, at the same time, it may seem a bit complex at first due to Elixir's functional nature. Images_to_show = product.Phoenix is a fast and reliable MVC framework written in the language Elixir (which, in turn, relies on Erlang). ![]() JS.navigate( ~p"/products/ #, socket) do |> stream( :products, Products.list_products()) |> assign( :page_title, "Listing Products") Lib/mercury_web/live/product_live/index.ex: defmodule do use MercuryWeb, :live_view alias true def mount(_params, _session, socket) do Replace the contents or create the following files. Live "/products/:id/edit", ProductLive.Edit, :edit end Live "/products/new", ProductLive.New, :new We'll start from the generated code and we'll adapt it by adding the code from the official docs.Īdd the following routes to router.ex: scope "/", MercuryWeb do Let's write the code for file uploads manually following the official docs for live_file_input. (Find the code for this part on the phoenix-code-generator branch of the git repo) Official live_file_input docs That's reasonable because the code generators have no way to know that we intended the array of strings to be image URLs and that the input should have a type of file and be supported by the live_file_input component.Īs powerful as the generators are for CRUD pages, in this case, we need to do it by ourselves. We'll see that the generated code for the images attribute is an input field with type of select ( lib/mercury_web/live/product_live/form_component.ex): ![]() Our first attempt is to use the Phoenix code generators: mix Products Product products name:string images:array:string We'll use a simple migration and schema for a Product with two attributes: name and a list of images, stored as an array of strings. I'll name mine mercury: mix phx.new mercury -install Mix archive.install hex phx_new 1.7.2 -force Let's start by creating a new project with the latest Phoenix version. Keep reading to discover what I learned in the last couple of days trying to code this simple task. When editing a Product, you should be able to remove any of the already associated images and add new images to the Product, always respecting the limit of 3 images per product.Īnd given that Phoenix has pretty good code generators and LiveView now has an amazing live_file_input component that automates uploading files in an interactive way, it should be pretty easy to implement. Each Product has up to 3 images associated with it. Imagine you are writing an app to handle products for a marketplace. ![]()
0 Comments
Leave a Reply. |
AuthorWrite something about yourself. No need to be fancy, just an overview. ArchivesCategories |