**Introduction to Localization with IAT Next**

Localization is a crucial aspect of software development that involves adapting an application's language, culture, and formatting to suit different regions and markets. In this article, we will explore the world of localization using the IAT Next framework, which provides a robust solution for managing translations in web applications.

**Using the IAT Next Framework**

The IAT Next framework is a powerful tool that allows developers to create localized versions of their applications with ease. Our application was built using the framework, and we were able to take advantage of its features to ensure that our application was accessible to users across different regions. With the IAT Next framework, you can quickly translate your application's text, images, and other content into multiple languages.

**Translating with Interpolation**

One of the key features of the IAT Next framework is interpolation, which allows developers to integrate dynamic values into their translations. This feature is particularly useful when working with data models, as it enables you to replace placeholders in your translation strings with actual values from your data model. For example, if you have a string that says "Hello, {author}!", you can pass the author's name as a value for interpolation.

**Working with Data Models**

The IAT Next framework also supports working with data models, which allows developers to pass entire data models as values for interpolation. This feature is particularly useful when working with complex data structures, such as arrays or objects. For example, if you have an array of authors and want to translate a string that says "Authors: {authors}", you can pass the entire array as a value for interpolation.

**Formatting and Plurals**

The IAT Next framework also provides built-in formatting options, including plural rules, list format, display names, number format, and date/time format. These features enable developers to handle complex formatting scenarios with ease. Additionally, the framework provides support for plurals, which allows developers to handle different translations for singular and plural forms of words.

**Localization Strategies**

The IAT Next framework also provides a range of localization strategies, including project settings, translation processes, and integrations. These features enable developers to manage their translation projects efficiently and effectively. Additionally, the framework provides support for crowdsourcing, which allows developers to work with volunteer translators and manage translation projects remotely.

**Crowdsourcing and Translation Management**

Crowdsourcing is a powerful feature of the IAT Next framework that enables developers to work with volunteer translators and manage translation projects remotely. The framework provides a range of tools and resources to help developers manage their translation projects, including project settings, online editors, and visual information. Additionally, the framework provides support for different types of translators, including volunteer translators and paid translators.

**Best Practices and Advanced Concepts**

The IAT Next framework also provides best practices and advanced concepts that enable developers to create high-quality localized versions of their applications. These features include translation resolution, fallback names, namespaces, and more. By following these best practices and understanding the advanced concepts, developers can create localized applications that are both functional and visually appealing.

**React-Specific Documentation**

If you are building a React application using the IAT Next framework, you will need to consult the React-specific documentation. This documentation provides detailed information on how to integrate the IAT Next framework with React, including step-by-step guides on how to use the trans component and other features.

**Crowding Documentation**

The Crowding documentation is an essential resource for developers who want to learn more about the IAT Next framework and its integration with Crowding. The documentation provides detailed information on how to create a project, upload source files, and manage translation projects. Additionally, the documentation includes visual information, screenshots, and quick-start guides to help developers get started quickly.

**Conclusion**

Localization is a critical aspect of software development that requires careful planning and execution. The IAT Next framework provides a robust solution for managing translations in web applications, and this article has provided an overview of its key features and capabilities. By following the best practices and advanced concepts outlined in this article, developers can create high-quality localized versions of their applications that are both functional and visually appealing.

"WEBVTTKind: captionsLanguage: enlocalization is the process of adapting content to suit the language culture and preferences of a specific target market we've been using crow in to localize the freeo camp curriculum and articles in this course you'll discover how to use crow in to streamline your translation processes enabling you to effectively reach a diverse International Audience by embracing localization you can significantly enhance user experience broaden your Market reach and ensure your content resonates with people across different cultures and languages as Stephania teaches this course she is an amazing instructor who also runs the free camp.org Spanish Channel if you speak Spanish I encourage you to check out that channel if you're new to the world of localization this course is for you hi I'm stepania software developer and course creator for free code camp we will dive into the world of localization you will learn how to translate resources and software on crowding a localization management platform with all the features and a free plan that you need to get started but why is localization so important translating and adapting your content and your platform is essential for reaching a global community of users right but there are many details faces and tools that you need to know to get started and to reach that final translated platform where do you start this course is here to help you understand all of this step by step it's it's for everyone who wants to learn localization whether you have a technical background or not or whether you're an individual a team or an organization this course will be helpful for you you can apply these principles to any project that you need to translate that's why we will start from the basics my goal is to take you from zero knowledge of localization to working knowledge and actually being able to translate a website and manage a localization project or team on crowding this is our road map ahead we will start by looking at Freo Camp as an example of an organization that is currently managing a localization project worldwide and how we are approaching this task from there with this context we will dive into the fundamentals of localization including important terminology faces and roles this first part is based on Theory but that theory I promise you will be super important when we reach the Practical aspects of of actually localizing and crowding our localization management platform we will create a crowding account and we will go through the most important features of this platform to get started as an individual team or organization this will be an in-depth overview and by the end of the course you will know crowding in detail we will also cover how to integrate crowding with external services and platforms like GitHub and Google drive and how open-source and educational projects can get a free license for crowning Enterprise the last part of the course will be focused on actual development you do need to have some basic react knowledge to follow along step by step but only the fundamentals should be enough to understand what we're doing we will create a basic react app using the react IAT next framework then we will be able to switch the language of our react application and localize the text on crowding plus we will see four techniques and tools for translating a website including crowding Visual Studio code extension GitHub integration JS translation proxy and crowding in context for organizations when you complete the course you will know the theoretical and practical aspects of localization are you ready let's begin localization is waiting for us fre cam.org is an example of an organization an open-source project that has embraced the con conceptt of localization for reaching a global Community our coding curriculum is available in many world languages including English Spanish Chinese Japanese Portuguese Ukrainian and Italian actually if you go to our website right now and you click on this little icon at the top you will see a drop- down menu with these languages and you will be able to localize the platform automatically in just a few milliseconds and you will be able to learn to code in your native language that is the power of localization opening the doors to everyone around the world without any language barriers our community is also actively working on translating free codam into many world languages including Bengali Dutch French German Hindi Korean sahili and many more we have many world languages available for localization because our goal is to reach a global community so we have these languages enabled and available in our localization platform we also run localized Publications YouTube channels forums and other resources but this is a group effort this is an an amazing effort made possible by the amazing free code cam community and the members of the free code cam staff because our localization process has one main goal to remove any barriers that could prevent someone from accessing the education they need and deserve that is our goal and that should be your goal if you're planning to localize your product or resource remove any barriers and let people or users or your community come to you and learn or enjoy your product without any barriers one of the key features of our localization effort is that it is performed by humans for humans our processes focus on what matters the most our amazing community of Learners who waake wake up every day around the world excited about learning new skills we believe that language and cultures should not be barriers for learning knowledge should be accessible worldwide that is why we started this process and why we will continue our localization effort one of the key aspects of our process is that it is managed and run by humans for humans translations are written and approved and checked by our amazing community and staff because let's be honest usually anyone can tell when a translation has been generated automatically we can detect it we can see it it's much more literal it lacks the clarity and sometimes it feels disconnected from the context and the original tone of the text which can take away from the meaning of the text or the original message of the content human translators are much better at adapting languages and translating sentences in a way that sounds more natural in different languages and cultures at come we have an amazing community of contributors who dedicate their time to translate and check our translations and an amazing team of Staff members Who oversee the process with the goal of publishing highquality translations for Learners since we launched our localization effort more than 2,000 translators and 60 proof readers have helped us to accomplish our mission if this sounds interesting to you and you would like to join free Cam's translation effort please find our contribution guidelines in the description during this course we will also talk more more about our localization effort and how we are specifically using our translation or localization platform to achieve our mission but managing such a large project with a worldwide community of contributors might seem complicated right how can we accomplish all of this as a nonprofit organization you will get answers to these questions during the course we will cover this from the perspective of a nonprofit organization but the principles can be applied to any localization process that you need we will cover all the fundamentals of localization specifically we will talk about localization on a platform called crowding the course will start with General localization Concepts the process and the different steps and roles that you can have in a localization team after that we will talk about crowding for beginners all the fundamentals of how you can localize a resource or platform in crowding and then we will talk talk about crowding for teams and organizations because if you are representing an organization you will very likely have to work with multiple team members how can you organize your tasks how can you assign tasks to different members that is possible in crowding and in localization Tools in general so we will talk about them in more detail and we will also talk about crowding for developers this part will be a bit more Technical and we will talk about different features of crowding that developers can use to autom made and improve the efficiency of the localization process are you ready we will also talk about how to localize a website because that is usually one of our main goals when we create a website right if you're trying to reach a global Community your website should be localized and you will learn how to do that in crowding and you will be able to apply all these general principles to any localization process that you need to complete awesome so let's start the localization fundamentals section we will talk about the key Concepts and the key phases and roles of the localization process so let's begin great so now let's start with an overview of the fundamentals of localization and the steps you will need to take to make sure that your platform can be used without any language or cultural barriers specifically we will cover the concept of localization and everything that localization involves we will also talk about translation and how translation can be a bit different from localization and we will talk about prove reading which is another phase in this process it's very important and we will talk about it in just a moment we will also talk about the most common file formats that you will find in a localization process so you're familiar with them and you know what they do and what type of data they contain and we will talk about the faces and roles of the this process to make sure that your project runs smoothly you can have managers you can have translators proof readers and more so that is basically what we will cover in this part of the course the fundamentals what is localization localization is defined by the Cambridge Dictionary as the process of organizing a business or industry so that its main activities happen in local areas rather than nationally or internationally in the context of products and services and platforms localizing something really means adapting that to the language and culture of a specific population this also applies to software products and our course will be focused on localizing software products because they need to be adapted to different cultures as well and we will see how during the course software also needs to be localized and the platform that we will be working with crowding is a software localization platform why is localization important let's say that you are an organization with a global community and you keep your resources in English what will happen with these communities that let's say do not speak English well then you will be closing access to those communities to your platform or service and if you're an education platform or an organization whose goal is to reach as many people as possible people around the world then you will need to create that Global community of Learners who are interested in your platform who can find it helpful and who can spread the word about your resources now localization is a bit different from translation you might be surprised to know that this concept is actually broader the Cambridge Dictionary defines translation as the activity or process of changing the words of one language into the words in another language that have the same meaning so notice the key part of this definition translating is just changing the words while keeping the same meaning it's very helpful but a bit limited because when we translate something we want to say exactly the same thing in a different language however localization can go beyond that let's say that you have a file in English and you want to translate it into Spanish what do you do in that case well you translate it and you say the same thing in Spanish localization can go beyond just translating the words it can adapt the content better to another culture or country when you work with resources in English you will usually find like feet inches and those types of units for measurement for length but in Spanish we typically use meters and centimeters so converting that will be helpful for your users readers and viewers another example would be adapting the colors here let's say that we have a website for a particular population and we have this pinkish color but let's say that you've done some research and you decided to adapt the website into a different color that is also an example of localization because you are translating your content but you're also adapting it to fit the local culture better what are the types of resources that you can translate because we're talking about translating resources right when we talk about translation we usually think of a text document right like a Word document or something that has text on it and that is a very common application of localization but the term is even broader because you can localize or translate many different types of resources spreadsheets websites games even scripts and movies podcasts or videos with voiceovers or by translating their subtitles and or even localize in the subtitles if you would like to use local terminology when we create resources we will work with many different types of files and text combined with video is also very common in localization projects localization is not limited to text format we will focus on software localization during the course but I just want you to know that there are many different types of resources that you can translate and localize let's talk about common file formats that you can work with in a localization project this will be a very quick overview I promise you okay there are many different types of files but I carefully chose those that are most common for you okay first of all we have text files plain text files with the txt extension they do not store any images or non-text characters then we find comma separated values or CSV files here we are going to store text but the values are going to be separated by commas each line will represent a record in your data and this type of file is commonly used for data exchange the file extension is. CSV then we find HTML files they are mostly used for web devel velopment they have a file extension of HTML hypertext markup language and these types of files represent the structure and content of a web page they can be opened in a web browser Json files are also very common to store data Json stands for JavaScript object notation but it's actually independent from any programming language this type of file stores key value Pairs and it is commonly used for data exchange especially across the web after that we find markdown files to create formatted text it's a lightweight format with a specific syntax that is commonly used to write software documentation and blog post but its applications go even beyond that we also find portable object files portable object files are more specific for the localization process commonly used for writing multilingual systems get text is used by development engines like the Unreal Engine and XML is also very common extensible markup language these files are used to store share and reconstruct arbitrary data you can represent the data in an arbitrary way that fits your needs it's commonly used to exchange data over the internet and it's very important for localization in particular because many localization Frameworks use XML for example Android and we also find these types of files x l i FF files the file extension is exactly that xli i f f it this stands for XML localization interchange file format specific for localization it's an XML based format it's used to standardize the way localizable data can be passed between localization tools and we can also see this xlsx files and they are usually used used to store data in spreadsheets we also find Rex files well we can pronounce it like this or re SX files this is the file extension it's an XML resource file that is used bynet applications for storying resources that can be localized and this is something that you might be familiar with it's more standardized and it's not specific to localization it's PDF files it's a portable document format has a consistent format across software hardware and operating system so it's very helpful you will always see the same format when you open an PDF file independently of where you open it awesome and now you know more about the localization process and the files that you can work with let's talk a bit about continuous localization continuous localization involves localizing a product continuously as it is updated or expanded in an agile product development cycle it's often used to localize software products with the traditional localization process we would for example write a book then we would translate it and we would have the translated version right and that could happen once every few years when we make some updates or changes or we have a new addition but now with the software industry everything has to be faster because we're constantly updating the software and changing things in our user interface and in our content that will be a continuous process that is what continuous localization is all about continuously localizing the product as it is updated and in this case the product would be our platform great so now that you know exactly what localization is and how it is applied in the software industry we can start talking about some key local localization Concepts that you should know localization terminology you will come across these terms very often in the context of translation and localization here we have internationalization internationalization is defined by the Cambridge Dictionary as the action of becoming or making something become International in the context of localizing a software product it also involves adapting the user interface for working correctly with other languages and making sure that it is ready to be translated after that we find the term culturalized culturalized is defined by the maram Webster dictionary as deriving from or imposed or conditioned by culture so culture here plays a key role because every culture has different traditions and vocabulary culture can play a key role in how communities Embrace different products campaigns and platforms so understanding how to adapt them is very important to succeed and you will usually want to get the advice of someone who is very familiar with the culture that you're trying to Target pseudo localization is another very important term but let's start with the prefix pseudo the pseudo prefix is defined by the cambrid dictionary as pretended and not real pretended and that is exactly what pseudo localization is all about we have the prefix over here pseudo localization it's like a fake localization process the process of creating fake translations that act as placeholders for the real translations of a product or platform but right now you may be asking why would we ever need to use fake translations the answer is very curious we use these fake translations to check if our software is ready to handle multiple languages even before the translation process begins because remember that usually you will have a budget before you even start to work with that budget for the localization itself you can check if your software is ready to be localized with this process that is very curious I know and it's a very important step in this process that you may have not considered before this moment one specific example of this would be checking if a language that tends to have shorter or longer words works well with our current user interface because some words may be longer and some words may be shorter how does the UI adapt to those changes and will that work correctly if you check on Free Cams website and you try to change the language in this little icon at the top you will see all the options in the drop- down menu and after you click on them you can see that the user interface still works with different language even if they have different symbols if they're longer if they're shorter and that is also part of the pseudo localization process after that you translate the terms and you actually translate the platform but it's very important to make sure that the UI works correctly another example is making sure that the user interface is ready to handle right to left languages like this one some languages are written from left to right like Eng English or Spanish but other languages are written from right to left how is your user interface handling this is it prepared to handle that will you localize your product into this type of language those are common questions that you should ask yourself even before you start translating your software and pseudo localization can also be helpful to find any strings that may still be hardcoded in the project source files because when you start start translating your project you may need to move your strings to a specific resources file where you keep all the translatable strings but if you keep some strings that are still hardcoded they will not be translated and you will have that small issue in your user interface so pseudo localization can also be helpful to spot those cases that is the ultimate goal of pseudo localization checking if everything is ready to start translating awesome let's talk about machine translation machine translation is defined by Amazon web services as the process of using artificial intelligence to automatically translate text from one language to another without human involvement we will talk about this term in more detail during the course because the localization management platform that we will use to translate our resources has this feature which can save us a lot of time however these are usually not perfect and they will have to be checked before they are approved the process of generating machine translations is like this you upload your file to the platform of your choice and then the platform in their servers or in their infrastructure will start running a specific process with artificial intelligence here we have the little bot this is representing the artificial intelligence how cute once that process starts it will try to translate your resources automatically and you will have a translated file as a result however usually when you use machine translation the translations are not as accurate as they could be if a human translated the text so these translations will have to be checked however the process the automated process can save you and your team a lot of time because instead of writing all the text you will just be reviewing the translations and actually making the changes crowding the platform that we will be working with has this feature and I will show you how to create machine translations for your project great so now you know more about machine translation and now we can start diving into translation memory yes they are very similar in their acronyms we have Mt or TM and that is something that you should note they are very similar however they are very different please after we talk about these Concepts take a moment to understand their differences because we will see them very frequently and they can be confused translation memory is basically a database that stores segments of your resource these segments can be sentences paragraphs or sentence like units like headings titles or elements in a list that have previously been translated in order to Aid human translators so we will have like puzzle pieces the individual translations of sentences or different segments of our resources that we can combine automatically and review before we actually approve the translations but we will have them there in a database and we can make sure that we are being consistent in our translations because what happens when you upload a file or resource to a localization platform or tool usually the tool will divide your resource into many different segments that we call string when you see the word string in a localization platform that means a small segment of your resource that would be a file or a text file or any type of file that you uploaded to your platform when you upload your file to the platform the file will be divided into these strings right the string will be translated by your team or yourself if you are handling the translation process and after that you will have a translated string the translated string will be stored in a specific database of the service that you choose and that is how you gradually create your translation memory and then your translators can reuse the translations made by other translators to make sure that they are being consistent throughout the team that is great right so after that you can just take the string from the database and use it in your new transl ation it might not be exactly the same you might need to adapt it but it will save the save you or your translators a lot of time we have the database over here using the translation memory is helpful for saving time and for ensuring that you are being consistent while you translate the terminology and here we have what I was mentioning a few minutes ago the difference between TM and Mt these are acronyms that you will find very frequently in the localization tools of your choice we will find them frequently in crowding and you will find them often as acronyms so it's very important to differentiate them TM is translation memory it's the database and machine translation is Mt this is the automated process of creating the translations and this is the process of storing the translations in a database please take a moment to understand this difference because we will find them very frequently TM is translation memory and Mt is machine translation awesome and since we are mentioning artificial intelligence with machine translation that takes me to this concept of large language models llms you might have heard about them they are very popular right now with the rise of chat GPT and other similar models and chat Bots but what is an llm a large language model is a deep learning algorithm that can recognize summarize translate predict and generate content using very large data sets a large language model basically takes a huge data set and it learns from that data set it learns to recognize summarize translate predict and generate content based on the data set it was trained on so when you talk to for example Chad GPT and chat GPT gives you an answer to your PRP that is an answer generated automatically but it is based on the information or data set that the model was trained on that is exactly what powers these tools right now like chat GPT and other chat Bots that you can chat with to create content or to find answers to your questions these terms are fundamental if you're looking to dive into translation and localization and you will also find tools with artificial intelligence that are used exactly for this process because artificial intelligence is really changing how we translate and localize our resources the foundation of these models is called neural networks that work like the neurons in a brain generating different networks that process the data and generate a result so these are terminologies that you will find very often I just want you to be familiar with them before we find them in the platform another term that is super super super common and that you might be confused at first when you see them is numeronym numeronym are words that use numbers to represent an abbreviation for example in the localization context we find this L1 n that is a numeronym that represents the word localization the number 10 stands for the 10 letters that we have between the letter n and the letter N over here we have 10 letters since it's a very long word people tend to abbreviate it and they write the numeron name here but it's important to be familiar with this in this context and over here we have an even longer word which is internationalization and it's very common to abbreviate like this I 18 n the number 18 stands for the 18 letters between the letter I and the letter N at the end sometimes you may find the letter L over here in lowercase or in upper case but capitalizing the L is often helpful to distinguish it from the letter i that we have here because with certain fonts they can look very similar great so now that you're familiar with these Concepts that are fundamental for the localization process let's talk about prove reading when you translate something after that translation process comes the proof reading process the proof reading phase when you upload a resource to your platform form the resource will be divided into multiple strings right the strings will be translated and after they are translated they have to be approved by someone that process of approving the translations checking if everything is correct and also making changes if they find any inconsistencies or spelling mistakes or typos is called proof reading if they find anything if the proof readers find anything that shouldn't be there in the translations they can just modify it and make sure that you are providing the best translations possible for your users so we can Define improve reading as the process of checking updating and approving the translated strings translating and proove reading are two different stages of the localization process and we will look at these processes in more detail you will learn the steps involved and the different roles that team members can have to make sure that your content is localized correctly directly the role of proof reader is one of those key roles in the process and speaking of faces and roles let's talk about the different phases and roles of the localization process what steps are required for localizing a project where should you start here are the steps to help you answer those questions after you decide that you want to localize your platform or project there are many steps that you should follow or at least questions that you should consider first of all let's start with step number one defining the scope and the goals of your localization project before you start to localize any file basically it's important to take a moment to analyze these two aspects of your project the scope and the goals you should ask yourself questions like who is your target audience what are you trying to achieve how will you reach your goals do do you need to localize all your project files or just a few or do you have to create a new resources file to keep all your strings how will you localize the resources will you translate the resources yourself if you're bilingual or will you find a team to help you into how many languages would you like to localize your product what is your available budget to start with what is the timeline for your project are your goals realistic given your current budget if you're an organization will you involve your community in the translation process or will you hire a team to help you with that will you use automated tools like machine translation these questions are essential if you want to be successful defining clear and realistic goals can be very helpful for avoiding any unexpected challenges during the process you should write down your goals and make sure that you have a key outline of the steps that you will need to take to start execute and complete the localization process before things get more complicated planning from the start is the key to success now step two after you have all of that planned it's time to create the actual source files that will be localized source files is just a term that we use to refer to the files that you will localize the original files in your project having a clear initial idea of the complexity of a project will be helpful later on in terms of time management and budget required remember that planning is essential to save you time and resources if you have a very simple project then your course of action will be very different than if you have a very big project with many different thousands of millions of strings that you have to translate the complexity of the project will change your road map so Iz in that is also very helpful you should also evaluate how many times you will need to update the resources will you use a traditional translation process where you translate and then you just update the project every once in a while or will you localize your product continuously what type of tool do you need if you're going to localize it continuously those are questions that you should have answers for at this stage in the process and after that that step three is preparing your product for localization this is especially true for software products and this is very technology specific the tools that you use to internationalize a react app for example may be very different from the tools that you use for an Android application or an iOS application or even a game however the approaches and Concepts that you will use are essentially the same if you developing a web app application you will need to implement multilingual routing routing just means that you want to take your users into the specific part of your application where they can choose and see the content in their preferred languages to do this you have two options because it's very important for them to choose the right language and go to the right part of your website where they can access the resources in that specific language for that you will need to implement routing first of all you need to choose how you're going to represent that in the user interface and that is another UI consideration that you should be aware of but to actually implement this you have two main options you can either add the language code as a subdomain in the web application URL like this here we have for example the French subdomain for this website or you can also add the language code to the URL for example you can have it like this French language codes are also very important in the localization process and that is something that you might want to check as well when you start localizing your product there is a standard worldwide for how you can represent different languages with two or three characters like here we have French Spanish is es English is em and the type of abbreviation is also important for the actual implementation of this routing process these options are recommended for search engine optimization purposes so if you want to rank higher in search engines you should Implement multilingual routing with one of these options your software should also be able to handle and display any adapted numbers dates and currencies since localization may also involve adapting them into different formats for different different cultures let's say that you are creating an e-commerce app and you want to accept payments in dollars or Pounds or Euros you will need to adapt your user interface to show that specific symbol for the currency that the user has selected those are considerations that you should be aware of before you start the process and when you're making sure that everything works like you intended also date formats are very very important for example here we have a very different way to represent the same date if we are writing a specific date in the United States like this we can see that in the United States the day is written after the month but if we go to a different country like let's say Uruguay the day is written before the month in a date format that is the most commonly used format in in different cultures so this difference in how we actually represent the date is key to avoid any errors or misunderstandings in how the web app that you're developing or the platform that you're developing will be used by your users So to avoid any misunderstandings date formats is also super important to check another application is exactly what we were talking about here if you are accepting a payment in US Dollars you will have to write the symbol the dollar symbol but here if you are taking a payment in pounds from United Kingdom you will need to show this symbol in pounds how will you handle this in your user interface that is another very important aspect of internationalizing your web application another important aspect of preparing your software for translation is making sure that you are including the necessary context for your translators why because many internationalization tools just create the resource files where we keep all the strings but they created with only one key value pair for each piece of text they associate each piece of text in the source language in the original language to its corresponding translation but it's also very important to make sure that the resource files of your project include some contextual information of content and elements around them to choose the best translation possible try to include as much context as possible in your resources in your strings and finally another aspect is that your application should be able to handle pluralization correctly because different languages may have different numbers of plural forms some of these features may be available with the software development kit that you're using but you may need to add some of them using third-party libraries and that is always important to consider and check first however since it's very technology specific that is something that you will have to research about for your specific application great so that was step three internationalizing your software and getting everything ready if you analyze the scope of the project and you decide that you cannot complete it by yourself then it's time to assemble a team you may hire a team or if you are a nonprofit organization like free code Camp you can also use crowdsourcing to ask your community to help you with the translations you might be surprised by the number of general and kind members of your community who will be willing to help you achieve your goals with free go gam we are involving our community in a translation effort once you have your team or your community you can start to assign them roles and that is another key aspect of the localization process we will talk about Ro R specifically when we start diving into crowding but let's see a brief overview of these roles right now translators use the localization platform of your choice to translate the resources prove readers review edit and approve the translations developers work on more technical tasks they work on integrating the tools that you choose to automate the localization process as much as possible the developers can help you and your team to save a lot of time by automating tasks that are repetitive and that can be optimized and finally project managers coordinate the tasks of the project to make sure that the localization project moves forward smoothly as fast as possible awesome let's go to step five which is actually choosing the localization tools after you have your team and you know the roles that they're going to have you can start to choose localization tools choosing the right localization tool can be essential for reaching your goals in the world of localization there is a type of tool called localization management platform this type of system is designed to help you automate repetitive tasks with the goal of optimizing your team's workflow humans will still play a key role in the localization process but with the help of a translation management system or a localization management system they can reach their goals much faster usually these systems can be integrated with content Management Systems to import content automatically from other platforms such as blogging platforms for example let's say that you are creating a publication and you want to translate your articles if you have a localization management platform to work on you can usually integrate that with a Content man management system of your choice and keep your content translated by importing your resources then localizing them and exporting them as the translated versions with the proper Integrations translation Management Systems can also check if there're happening any changes in the source files and import new content automatically to start localizing it so that is a key aspect of data exchange between the localization management platform and content Management Systems a real world example of this process is right next to us free cam translates its resources on crowding when a file from free Cam's curriculum changes the new content is updated automatically in the system in crowding in our project so contributors can translate it and publish it very quickly automating this process can be very helpful especially for large organizations ations with different projects and files that's the advantage of using a localization management platform now it's time to translate the resources usually these platforms will divide the source content into what they call strings we already saw that concept right strings there are parts of the original text that you can translate save their translations and the software will take care of storing and combining them in the correct place in your file after you have those resources translated then it's time to prove rthm which is one of the most important phases of this process proof readers should check if the translations are accurate if there is a better way to adapt them to a culture or language they can check if there are typos or misspelled words and if the correct format is being used they can edit and approv their translated strings and approve the strings once everything is ready all those small details toils really count for the user experience so this step should be taken very seriously and after the resources and the translations have been Pro R it's time to export the localized resources if your project is small you have the option to do this manually but if your project is more complex you can choose to automate this process with different Integrations like we mentioned on your localization management system for example crowding the platform that we will be working with during the course has Integrations with different platforms including GitHub Google Drive Google Sheets Dropbox MailChimp WordPress and so on it has hundreds of Integrations that you can add to your project to synchronize the content automatically if your translations are ready and approved for example in the context of GitHub and you set up a GitHub integration the translated files will be updated automatically in your Project's repository you can even configure where the translated files will be stored that is the importance of Integrations and after you have everything set up after exporting that automatically or manually your project will be translated but you should still check for changes because projects and platforms can evolve over time files can change as you add new features and content and this is especially true in the context of free code cam because we add new content and update our existing curriculum on a regular basis awesome so now that we covered all the localization fundamentals we can start talking about crowding fundamentals for localization projects we will talk about crowding you will see how we are applying all of these Concepts in this particular tool so let's continue great welcome to the second part of the course now we will dive into crowding fundamentals so let's begin crowding is a localization management platform that can be described as a cloudbased solution that streamlines localization management for your team that is exactly how crowding defines the platform crowding can be used by individuals by teams or by organizations we will talk about the different features and some of these features even overlap between teams individuals and organizations we asked the founder of crowding how he would describe crowding in five words and this is what he said continuous localization for modern companies so that is what crowding is for you will be applying your knowledge of localization on this platform and you will even learn how to localize a website with crowding services and Integrations the main goal of crowding is to expand the potential of agile localization agile localization ization can be defined as a process in which localization is incorporated into an agile product development cycle a cycle in which a product is constantly being updated in an iterative approach so you launch your product you get feedback you update it based on the feedback and that process is repeated in a cycle continuously in this context the word agile is being used to describe the localization process the translations are continuously and updated as the product changes however constant updates also require constant management teamwork file uploads and downloads and exports platform deployments and so on the process could become very complicated very quickly if your team does not have the right tools but with a localization management platform like crowding you and your team can save time and accomplish your goals more efficiently that's the ultimate goal to localize the product as quickly as possible as it evolves that is the cycle that we are referring to here and that is exactly what free Camp does now let's talk about the advantages of crowding why you could choose crowding as your localization management tool you can connect with external Services through integration to automate part of your localization process you can store translations on cloud-based services and Grant access to team members and contributors from all around the world with different roles and permissions you you can also generate machine translations automatically when a resource is created and ask translators to check and edit them to save time your team can also check the quality and format of the translations with crowding quality assurance spellchecking and proof reading features and you can also generate reports create custom workflows assign roles and permissions invite new members and more so as you can see it's a platform that will make the localization process much easier for you and your team crowding has a free plan that is what we will be working with during the course sometimes we may see if some features that are specific for organizations since pram is a nonprofit organization we have a different plan the crowding offers for nonprofits but for individuals who want to start localizing their content for free all the essential features are included like unlimited public projects one private project 60,000 hosted words one integration with an external service features for translators efficiency and unlimited translators in the public projects that you can have that is a free plan for open-source projects and educational institutions like fre Cod Camp crowding has special licenses if you want to use crowding for an open- source project sign up for a free account set up your project and send the team the crowding team a request apply for an academic license if your project has educational purposes each granted license will include an unlimited number of projects strings and members so if you're an educational or open-source project or institution you can contact that team specifically for open source and educational projects let's talk about important terminology for working on crowding strings we talked about them but now let's define them formally strings are smaller segments of the original text from your file that can be translated and saved individually into all the translations already they are combined to generate the localized version of the resource that you need that is important to keep in mind we also find the term Source language The Source language is the language of the original resource for example free code com's Source language would be English since our curriculum and documentation are originally written in English we also find target language this is the language that our resources are translated into it's important to know the differences source and Target a project could have multiple Target languages okay like for goam or you could have only one target language if you only want to translate your resources into a specific language we take the source language and we translate it into the target language QA checks stand for quality assurance checks these are automated tests that check if the translations have the correct format and spelling crowding has many QA quality assurance features that can help your team find and fix potential errors and they're essential for the proof reading phase of the process QA stands for quality assurance that is very important and then we find the term glossery glossery is basically a database of important terms in your project with their corresponding meanings one is a glosser helpful well it gives your translators more context about a specific term and it helps them to choose the most accurate translations for a particular word great and then we go to screenshot a screenshot is a picture of what you can see on your computer screen at a particular moment in time if your localization management platform supports this you can upload screenshots and Associate them to specific strings to give your translators more context of where this the specific string appears on your platform or resource and after that we also find crowdsourcing we mentioned this before but now we're going to Define it formally crowd sourcing is a localization practice based on community cooperation it's basically engaging your community in the localization process fram's translation effort is an example of crowdsourcing we also find pre translation it is an automated technique to translate your project automatically using machine translation or translation memory when you upload your files remember that we talked about machine translation and translation memory before right we Define them individually but now we are applying both of them we are combining them to form a new term called pre-translation we can either take the translations from our existing translation memory or use machine translation to translate new terms but the important thing here is that it is an automated process and we also find Integrations crowding has hundreds of Integrations and we will cover some of them in the course they are connections that you can make between crowding or the localization management platform of your choice and other applications or Services you could have an integration with GitHub Google Drive Google Sheets and finally the last three terms that we're going to Define here are more technical in nature for developers but it's important that you even if you're not directly related to the development aspect of the process it's important that you understand what they are first we find web hooks web hooks are automated messages that an application or platform will send to another application or platform when specific events happen basically what happens with a web Hook is that you have two applications let's say that something happens in one of those applications when that happens you will be able to communicate between the platforms and through web hooks run a specific process to handle that event and finally we will talk about the concept of an API an API is an application programming interface this is a more Technical and development oriented term it's basically an intermediary software that allows two applications to communicate with each other by sending information following specific protocols and rules of course crowding has an API that can help you to integrate localization into your development process in a more automated way and those are all the most important Concepts that you will need to know to get started with crowding so let's start diving into crowding and let's go to their main website crowding dcom we will see how you can create a crowding account and we will start translating a file so I will see you in the next part of the course great so after this detailed but super important introduction into the fundamentals of localization now it's time to dive into practice and actually start working on crowding so let's see how you can create your crowding account the first step is to go to crowding dcom this is where you can access all the resourc sources tools and products of crowding crowding is an example of a localization management platform like we've been talking about we see continuous localization you're already familiar with this concept and you can see that crowding is mostly focused on software localization but we will also see examples of other resources like translating PDF resources to illustrate all the basic functionality and then you can apply these tools and principles to other types of resources like mobile apps games websites and other types of products after you land on crowding dcom you will see this green sign up button you click here and then you will be taken to the register page start your localization Journey with crowding and here you will see two different options crowding dcom which is selected by default and crowding Enterprise crowding decom is where you can create a personal crowding account for a small team and crowding Enterprise is more oriented towards organizations if you register for crowding Enterprise you can create a new organization like for example free code Camp is a nonprofit organization and crowding has special plans for nonprofits for open- Source projects and for educational projects and they can create in an organization for free and you can also try it for free for 30 days so let's see how you can register here forcing.com first of all you will need to write your email to sign up for a new account then you will have to enter a username a password and you will need to agree to the terms and conditions and your privacy policy you will also see a check by Cloud flare over here so let's do them I'm going to write my email over here and then I'm going to choose a username let's say Stefania demo after I do that I will need to write a password once I see that the password is strong I can still make it stronger let's just add and something else here okay great now it says that the password is secure secure should be your Target because it will be give you the highest protection against any type of unauthorized signin or someone using your password it's always prefer to reach this level of security so let's just agree to the terms and conditions and let's create our account if you're already a member and you're already registered for crowding you can click here to log Lo in okay so next time when you are logging into your account just click here and you will be able to enter your email and your password so let's create an account awesome this is the main dashboard or the main screen that you will see when you create your account you will see that you will need to verify your email to be able to reset your password receive email notifications and enhance security so let's just go to my email and let's confirm this before we actually start to dive into the different elements that we have here because crowding is very powerful if I go to my email over here I can see that I have an email from crowding excited to have you on board welcome Stefania demo thank you for trusting crowding with localization to secure your account and receive email updates about the activities in the projects you create and join please confirm your email by clicking the button below here I'm going to click on this link and I will open a new window and I will see this thank you for verifying your email and now I can just close this confirmation message and now I have a verified crowding account with a verified email so everything is ready to get started right now I am on a free account so we will see all the features that we have available if we go to crowding dcom again landing page and we go to pricing over here we can see that they have specific plans and what we're going to cover in the first part of the course is related to the free plan they have a free plan to start localizing your content for free with all the essential features for translators included unlimited public projects 60,000 hosted words one integration features for translator sufficiency and we will talk about many of these features in the course we also see one private project and that is great because we're going to work with one private project during the course but you can also create unlimited public projects and you will also be able to add unlimited translators in public projects just note that users on a free plan donate their translations to crowding translation memory remember that we talked about translation memory where the it's like a database of all the strings that have been translated in a project project that you can reuse well when you use the free plan you donate your translations to crowding translation memories so they can help others to reuse those translations and after you have your account already created let me show you how you can log into your account again if you sign out and then you want to log back in you just go to Crow in.com you click on login over here and in crow.com you just need to enter your email and this is the email that I used to register and this is my password I'm going to log in and now cing is asking me if I want to stay logged in they can remember your session so you wouldn't need to log in as often you can choose to do that or not it's definitely up to you you will see your username over here not now and voila we're back at the dashboard the main dashboard if you want to log out of your account at any moment you just need to click here on the profile on your profile image and go here to log out that will log you out of your account and then you can log back in awesome now you know how to create your account how to log out and how to log in again whenever you want to work with crowding great and now that you know how to create a personal account on crowning decom let's also check how you can sign up for a crowding Enterprise account in case you are representing an organization like free code Camp a nonprofit organization or another type of organization and you want to try crowding Enterprise to do that you would just need to click here on crowding Enterprise then enter your organization name this will be the URL of your organization on crowding so here you could have for example free goam demo. crowding docomo here your username and your password and agree to the terms and conditions and the privacy policy you will need to follow a similar process to verify your email like we did before and after that you will have your organization ready if you want to enter an existing organization just click here and you will be able to enter your organization's URL for the course we created a demo organization free codam course demo. crowding dcom and after you enter the URL you just click here on continue and you will be able to log in to the Enterprise with your email or username and your password you can also get a magic link to sign in without actually entering your email or password but let me show you how this works and what you would see once you're inside your crowding Enterprise account I am going to write my email and my password crowding is asking me if I want to stay logged in we can't remember your session so you wouldn't need to log in as often so we can choose to stay logged in or not right now you can choose either one of these options then you will see crowding logo and over here this is the main dashboard that you will see for a crowding Enterprise account you can see it is very similar to the dashboard that we had for the personal account with a few differences and we will be covering them during the course as well we will see how you can use crowding from the perspective of an organization or Enterprise great so let's continue now let's see how you can actually activate your free plan on crowding currently you can do this by going to crowding if you click here on pricing and you are logged into your account as I am here in my Stefania demo account you will see this plans for everyone and over here you can see the free plan you can also see your current account usage here you may find that you're using some Advanced features and if you don't see the option to upgrade to the free plan then it might be because of this and you may need to remove some Advanced features for that you may have used during the trial but to activ AC at the free plan you just go here and you should see this button but highlighted in green if you click on this button then you will be activating your free plan and you should see a confirmation message the confirmation message should be similar to this one get started with your free crowding plan create unlimited public projects and invite translation agencies or your community to translate remember you go to pricing then you click on this button which should be green to enable it if you don't see this button as an option then you may have some Advanced features enabled in this case you can have up to three file formats and that is included in the free plan but if you see other things here under this category this may be preventing you from getting your free account so make sure to remove them and then click on this button great so now let's see how you can customize your profile one of the first things that you might want to do after you create your crowding account is to customize your profile so let's do that after you create your crowding account you might see this short message and Survey that you will only see once after you create your account it says welcome to crowding we're glad to have you on board let us know you better so we can customize your experience how would you describe yourself here you can choose one of these options localization manager developer or translator Pro reader you can also specify how you would describe yourself here by writing a brief sentence and then you can click on submit or you can just close the short survey you can answer it or close it it's totally up to you so for now let's close it and now we can see the dashboard like you will see it after submitting the survey great so once we have that ready it's time to do one of the the first things that you will probably want to do after creating your crowding account which is customizing your profile to customize your profile you just need to go here and click on the small profile image which will have your initial there it's at the top right and then after you click on it choose settings from the drop-down menu like this in your settings you will see many different tabs but the first one is profile in your profile you will find many many many different settings over here but let's talk about them in detail first we find your profile picture you can drag a picture here or select a file from your file system you can also remove your current image this button will be enabled when you customize your image then we find general information like full name your first name and last name your username which you can just change whenever you need to of course if it's not already taken by another crowding user we also see our email this is not publicly visible the email will be used for account related notifications like password resets project activity updates and invitations to projects you can set up an additional login method to have an alternative for accessing your account and here we have an option to connect that to protect your account that is recommended after that you can also write your company your job title and pronouns he him she her or other or prefer not to say by default you will see this marked I will choose she her and after that you will see about me you can write a brief description of yourself and that will be shown publicly on your profile if you choose to make your profile public we also see crowding language English here you will see your time zone it might be customized you might might need to choose it from the drop- down menu and you can filter like for example Monto from youry we can see it over here if we need to choose it but you can customize this like you need to then the time format is either 24 hours or a.m. p.m. the time format that you will see in crowding and here we have a list of preferred Languages by default you will see English but you can also add other preferred languages let me show you how you can add Spanish for example if you write Spanish here you can filter the list to all the items list items that have the word Spanish I'm going to choose Spanish in general over here and after you check the check box you will see that language appearing over here and here you can Mark a language as native are you a native English speaker then this should be selected are you a native Spanish speaker then this should be selected okay you will see that it is saving your changes automatically over here and what happens if you just want to remove a language you select it by mistake or something like that and for some reason you want to delete it just click on it like this and you will delete it from the list awesome right you can also just search here but filtering the search list is always super helpful and the the options are very specific you can choose the language from a specific region or country so you have English from from Puerto Rico you have English from Japan you have English from India so it's very specific and you can customize this to fit your needs after that we also see a new Option appearance you can select how you want crowding to look select a single theme or sync it with your system automatically switching between day and night themes you can choose light theme dark theme this is the Dark theme let me show you this the Dark theme or you can make it match the current theme of your system in this case I have a light theme because I'm recording this during the day so it might be helpful for your eyes if you just C sink it to your system but for now let's just keep it in the light theme and finally privacy this is very important you can height the projects and it tabs from displaying publicly on your profile page if you check this checkbox you will make your profile private by default it's not private so you should be aware of this and go here immediately if you don't want your projects and activity to be public and finally the last option is deleting your account but you will see a shiny red button over here because deleting an account will immediately delete all the projects created under your account and all the associated data deleted accounts cannot be restored not even by the team apparently based on this message so be completely sure that this is what you want to do when you press that button delete account awesome now you know how to customize your profile here in your account settings you will see other tabs like account notifications API security log o off and and beta features let's just have a quick dive into these options so you can see them your account tab has the the option to change your password you can also have your security Keys over here which are physical devices that add an extra layer of security to your online accounts you can register your security key here and you can also enable two Factor authentication to increase your account's security you can click here on enable to enable it and you can also create create SSO connections manage the accounts you have linked to your crowding account these connections allow you to log into crowding with a single click and remember that you have the option to log in with your Google account your Facebook account GitHub X and gitlab account and here you see a list of devices that have logged into to your crowding account and you can revoke any sessions that you do not recognize so this is for your own protection and it's a great feature you can also choose to revoke all the sessions if you need to after that we have notifications where you can customize all your notifications slack integration product updates H notifications you can set up a custom channel for the notifications and these are your Global notification settings you can send notifications for users and roles Integrations new strings language progress API integrative vendors content issues mentions tasks messages discussions and API notification you can choose whether to send the notifications in app or by email and if you just deselect this you will be deselecting all of them at once but if you enable this you will be enabling all of them and you can also disable that by email as well or you can enable and disable them individually that is great you can customize it to fit your needs and we will talk about these features in detail during the course after that we also find the API because crowding has an API that developers can work with the crowding API version two is a full-featured restful API that helps you integrate localization into your development process you can create personal access tokens for authorization when working with the crowning API the command line interface some of the Integrations and plugins here is where you can create a new token if you need to you have your personal account security logs all the login events and all the events related to your your account you also have o off applications you can create o off applications to access the crowding API and here we have some beta features that you can choose to enable if you would like to try them but they are experimental and still in developments so they are not quite ready for production they may change break or disappear at any time you can enable this if you would like to participate on that beta features testing process awesome now you know how to customize your profile and we talked about your account settings so let's start diving into the Practical aspects of croing and let's create a project in the next part we will create our first project in crowding great so now that you know how to customize your profile let's create a project we will do that from our profile page if you're in a different part of the platform like your account settings you can go back to your profile page by clicking on this small profile image at the top right and then clicking on your username here the first item that you can see in the drop-down menu yes you can do that or you can also click here and go to home this is your homepage this is where you will see all your projects you can explore other projects you will also see your activity your account activity over here in the activity tab to create a a project you have two different options you can either click here on the green create project button or you can click here on this gray button they are both equivalent and they both take you to exactly the same page so let's click on the green button since this is usually what we see first and that will take us to a page where we can fill fill in all the necessary information for our project like our project name our project address here this is the URL where we can find our project it must be unique if your project has multiple words and you write the those words here in the project name they will be connected here so let's see this free code Camp project demo you can see that as I type these words the project address is filled in automatically and the words are connected by a hyphen over here that is very helpful because URLs cannot have spaces so they have to be connected by hyphens and this URL has to be unique if this URL is not available on crowding then you will see a warning and you will need to add some variation to the URL you also see project privacy settings if the project is public they will be visible to everyone you can restrict access to specific languages after the project is created that is for a public project but by default the project will be private if you don't change this option a private project is visible only to the invited project members and we will see how you can invite project members in the part of the course where we talk about teams and collaboration for now let's keep our project private since we have a free account and the free account includes one private project after that we find the source language remember that we talked about the source language The Source language will be English we're going to translate a PDF file to show you all the basic features for now all the basic features and the PDF that we will be uploading will be in English so that will be our source language if you click here you will see a list with all the available Source languages that you can choose from you have very specific options so let's say that you want to filter the list by Spanish you can filter the list by Spanish and you also see Spanish specific to each one of these countries or you can also choose Spanish in general so that is great you can filter the list and after you choose the source language you will need to choose the target languages you can have one target language or multiple Target languages and crowding gives you that option to customize your project to fit your needs you can choose as many as you need you just need to check their check boxes and they will be added so let's let's say that we we want to create a demo project with a target language in of Spanish Japanese Italian Portuguese and we also want Portuguese Brazilian and Bengali as well let's just choose these languages to show you that you can select multiple Target languages and you will see them added to this list if you want to remove all the languages at once you can clear the list here by clicking on this trash can or you can also remove them individually by clicking on the language let's just remove Spanish and that will remove it we can add it again if we need to no worries you can also sort them alphabetically or sort them by popularity that is very helpful and it will also apply to your search another great option that you can use is that you can prefill the list with the top to 30 languages that are most popular on crowding without having to select them manually so if you're starting a project and you want to use crowd sourcing and you want to start translating your project to the most popular languages this option will save you some time you can also create custom languages as well that is another amazing feature that we have here on crowding if we click here on custom languages we will see the option to add a dialect initially you will not see anything because nothing to there is nothing to display we don't have a custom language but if you do need to create a custom language you can click on ADD and then you will be taken to this dialogue where you can write the name of the language it choose if it is a specific dialect of another language you can see the the language code on crowding how that language will be described with a a specific code you can also write a three letters code and a local code an example would be like English but from Great Britain if it's very specific to a region after that you have text Direction because some languages are written from left to right while some of them are written from right to left so you can choose the text direction for the custom language and you can also select the plural form different languages have different plural forms you can read more about adding custom languages if you click here and you will be taken to crowding documentation where you can learn more about these settings but it's great to know that this option is available let's check our settings before we create the project project name free cam project demo project address is free cam project demo it will be a private project and we can change this later on if we need to but for now we're going to make it private we also have the source language in English and we're going to choose six Target languages great so after you have all that information ready to create the project just click here on create project or if you decide that you don't want to create the project just click here on ccel and now let's just create the project we click here and we see project created successfully over here great if you choose to create a private project when we create our first project we will see this message this is the current state of crowding at the moment it might have changed at the time when you are taking the course but right now we see this message of the trial expiring in 14 days but this is a trial of the premium features in crowding after the trial expires we should go back to a free account with the features that we saw one private project unlimited public projects and a maximum number of hosted Words which was 60 60,000 words so you will still keep your free account after the trial expires great so now we have our first project in crowding free goam project demo of course it will be empty at first but don't worry we will take care of this in just a moment we will be uploading a file and we will start translating but first let's have a quick tour of this project and the different tabs that we have over here and how you can find all the information you need for your project we will do that in the next part of the course so I will see you there awesome let's have a quick tour of the project so you know everything that we have available here first we can see the name of the project over here next to our username here we can see the privacy of the project it's private otherwise you will see public here you can create one private project and unlimited public projects with a free account on crowding you can also see the project over here on this sidebar where you can find a list of all your projects and you also see the option to create a new project from here that is great because it is available here you don't have to go to your home again once you have this on the sidebar if you need to create a new project after that we find several different tabs let's go from left to right we start with the dashboard tab in the dashboard tab you can find all these elements let's let's talk about them first you have a filter to filter the list of languages that you chose here you can see all the target languages that you selected when you created your project we see Bengali Italian Japanese Portuguese Portuguese Brazilian I also selected this to show you that we will have them as independent like languages on the dashboard and we also see Spanish over here for each language you will have a list item with specific information in this bar you will see the progress of that language you will see them being filled with green and blue bars and they represent the percentage of the strings that have been translated and approved for that specific language right now if we click on them we see that there are no files to display but we will take care of that when we upload a file next to them we also see the details of the project we see the source language English project members one right now because it's only me words to translate zero the project was created 2 seconds ago yes that was really fast and the last activity was 8 minutes ago the quality assurance checks that we talked about in the slides remember when we talked about important terminology for crowding we saw quality assurance checks right now they say that there are no issues of course we have no files so there are no issues and we see the managers the project manager is currently my account I am the project owner and we will see how you can assign different roles to different team members in the course and you can also contact me here on this link so that is very helpful as well here we see a tool to search this will filter the list of languages so like let's say that I want to find Spanish here I just write Spanish and it will filter the list to show me only Spanish or other variations of Spanish local variations if I write Portuguese I see Portuguese and Portuguese brasilian this is especially helpful for many Target languages for example free code cam has more than 30 languages more than 30 Target languages available for translation so four are organization's project this feature can be helpful we can also choose how to sort the languages sort them by default order alpha numeric order completed first or uncompleted first if we want to see all the completed languages first we choose this option all the languages that still need some work first then we choose this option or just sort them alphabetically Alpha numerically and here we can see them in a different present instead of showing them as a list like this we can also choose to show them like in a grid which is a more graphical option I personally like this a lot and I like the fact that they include specific Flags or the language code it's very visual so you can choose the option that you like the most here we also find pre- transation remember what we talked about pre- transation yes we find it here pre- transation can be done done via TM or via Mt remember the difference between these acronyms yes everything that we saw in the previous section with the slides is coming back to us we see TM which is translation memory the database of everything that we have translated before we could use that for the pre- transation or we could do that via the machine translation which is like an automated way to translate your files and then of course you would need to check the automated translations but you can choose which method to use for the pre- transation and here you can go to the editor to start translating but right now we don't have anything to translate so let's not go there yet and you also have the option here to enable notifications Global mentions only or you can also mute project these are the different settings you can experiment with them and see what works best for you that is what we have on the Das dashboard tab for the sources tab we have another set of tools this is where you will see a list of all the files that you can translate right now we don't have any files to translate so we can use one of the following options to upload our source files we have the option to upload files from the our device they also support zip archive so that is also helpful in case you have a zip file you can use sample files from crowding to explore explore how the platform works we can set up an integration with the repository or other supported systems as well and we can invite developers to help us with the project setup so we have everything we need here we're going to upload our file from our device in just a moment we can see our files or we can also check our strings right now we don't have anything to display we will have them when we upload the file we can also group our files into folders here we can see that we can create a new folder and we can create a new version branch and we can add a file this is equivalent to clicking here to upload file okay and we can create strings Vault or set up an integration like we have over here so we just have multiple buttons to do exactly the same but they are both helpful and here we also have the trash can icon in case we would like to delete some of them great then we go to translations the translations tab in translations we have the option to upload existing translations and we will talk about that in just a moment we can also download our translations as a zip file if we select a language one of our Target languages then we can just build them and download them as a zip file we can also create Target file bundles but this is a bit more advanced and we can also set up over theair content delivery with Amazon web services and other services that you can use for this but this is a little bit beyond the scope of the course you can always learn more about this these features on the crowding knowledge base in the screenshots tab we have the option to upload screenshots to provide translators with more context this way you can significantly improve the quality of the translations because for example if you're translating a website it you have some strings on your website you have some text you might want to take a screenshot of the specific part of the website where the strings are are displayed and that will give them some context to provide the best translations possible here we have the tasks tab where we will see tasks that we have created for the project we will talk about tasks when we reach the part on teams and collaboration tasks are very helpful in crowding for especially for project manager and for making sure that the project runs smoothly here we can also find the members tab right now I am the only member of this project but if you are planning to add multiple members here you will see a list of members you can search members by name or username you can filter them by rols you can assign them different roles of course and we will also talk about that but you can filter them here and you can filter them by language as well if you select one or more members of this list you can also choose to contact them or uh you can also delete them in this case I am the owner so it cannot be deleted but you can also delete them and you can invite members another key thing that you might miss because it's right here to the right very apart from the filters is this option if you appli some filter like this and you just want to clear it you can click here on clear filter and all the filters will be cleared and if you have multiple Pages you can just go through them here on these arrows after that we find Integrations this is where we can add Integrations to our project and we can filter them reports will show us reports of our project we will also see them in more detail but right now we don't have enough data because we do not have any files but in the projects you can check the project status the translation cost Top members as well Top members of your project and here here we can find the activity the activity for this project right now is just one item I created this project and we can filter that by specific types of activities like project builds project setting updates Source strings updates translation activity comments and issues we can also filter the activity by languages for example we could check for Source string updates in Italian let's say and we could also filter the activity by user if you would like to check the activity of a specific user in the project and if you need to clear the filters you always have that option here great we just have three more tabs one key aspect of teamwork that will make your project run smoothly is communication and that is what discussions are for here we can create new discussions with this button and we can mark them as open or closed and filter them by language or by author the discussions are very helpful to discuss or talk about anything related to the project that you think should have input or feedback from multiple team members you can do all of that within crowding you don't need to go to an external tool to do that to create a new discussion you just click here on new topic and then you write the name of that topic the title you choose the language related to the topic or you might choose not to specify the name if the topic is not related to a specific language and then you just ask a question or start a conversation here and this supports styling with markdown so you can use markdown you can add bold text you can add headers and that is very helpful to format your text appropriately you can write it here and if you need to preview it you can preview it let me just write this something like heading one and in markdown we create a heading with a hash symbol and if you want to preview it with the final format you can just preview it over here great after that you just create the topic and you will see it in your list of discussions and over here we have some additional tools like the command line tool the crowding API web hooks we talked about web hooks which are like messages that are warnings that we and when something happens in an application that means setting up a notification for key events in your project and you can also translate your web application with a realtime translation preview with crowding in context and finally we reach the project settings talking about the project settings let's dive into the settings that you can customize for your project there are many settings and we will go through them in detail so we will do that in the next part of the course so I will see you there let's dive into the settings and talking about project settings let's dive into the settings that you can customize for your project here we have our free code cam project demo you will find different categories of project settings including General privacy and collaboration languages quality assurance checks translation memories glossaries and different options for your content like importing exporting labels parser configuration and file processors some of these settings are more advanced but let's have a general overview of what you can customize first of all by default you will be in the general settings the general settings include the project name the public description of your project and branding for example you can set a custom domain for your project to get an access to the custom domain name you need to create a cname DNS record in your hosting service and only the https protocol is loone here you also have the option to invite a developer if the developer is the one who is going to be creating the custom domain you can also set a Project logo by uploading an image with these formats it can be a JPEG image a PNG image or a GF file and after branding we find the batches you can choose to display batches to share the localization progress of this project via a batch image and this is a preview of the batches you can embed batches on your website or read me so your app fans can see the localization progress and help you with translations currently the batches are disabled okay but this is a preview and you would see the percentage of the progress of your project over here and the last option that you can see in the general settings is the option to delete a pro project but be careful with this because deleting the project will permanently delete all the resources associated with the project including any uploaded files translations approvals and Etc deleted projects cannot be restored so be really careful with this if you choose to click on this button this is for the general settings then we find privacy and collaboration settings you can set the Project's visibility like making the project public or private a public project is visible to everyone you can restrict access to specific languages after the project is created and if you choose to make your project private it will be visible only to the invited project members and we will see how you can send those invitations in just a moment when we reach the part on team and collaborations after that you can also see some privacy settings this was the visibility now we go to privacy you can choose to Ena or disable all of these options like task based Access Control if you want to allow offline translation this is selected by default if you want to allow proof readers to access hidden strings if you also want to allow project members to manage glossery terms or show machine translation suggestions connected with the machine translation engines that you choose they will appear as suggestions in the editor if you have this option enabled and the last category here are notifications notifications for translators when there are new strings to be translated if you want to notify project managers and developers about new strings and if you want to notify project managers and developers when a language translation or proof reading phase has been completed those are important notifications you can just enable them or disable them by clicking here on their check box great that is for privacy and collaboration now let's go to translation settings first we find languages initially when we created the project we chose a source language and a target language then here we can change that and even add custom language codes if we change the source language that might cause a plural form mismatch according to crowding for imported strings if your new source language differs from the initial one in plural forms it's recom recommended to update the source files accordingly okay so that is recommended you can choose it from this list that you have over here it's quite comprehensive you will find the language and specific local variations of that language for specific countries you can also change the list of Target languages remember that we selected six languages here right you can just delete a language if you need to and save your changes by clicking here or you can also add new Languages by selecting them over here it's basically the same component or element that we saw when we created the project and if you just want to remove all the target languages you can click here awesome now that you know how to change these languages let's go to QA checks remember that QA checks automatically highlight all the possible mistakes in the translations prior to their approval they're very helpful because detected issues will appear in prove reading mode and your proof readers can check them and fix them if necessary this is where you can customize what you want to check automatically you can check for empty translations length issues tax mismatch spaces mismatch barbles mismatch punctuation character case special characters basically anything that can go wrong when you try to translate a string any typos any mistakes like incorrect translation issues or spelling or typos or also making sure that you use the terminology consistently with the correct translation for specific glossery terms you can enable or disable each one of these QA checks for your project and then you just need to click on save to save your changes and over here next to each one of these checks you will see the type of warning or error that you will get for these issues that are detected in your project for example if the translation exceeds any predefined length limits you will see an error here but you can also change that to a warning error would be the highest priority for those issues and warning would be something a little bit of a lower priority awesome and you can also disable all QA checks simply by clicking here this is a faster way to do that if you just want to disable or enable all the quality assurance checks this one will not be selected by default you need to select it and enable it manually by clicking here okay and after that you just save your changes and voila here we have them right great they are very helpful and another thing that is super helpful is a translation memory in the translation memory settings you can enable auto substitution this feature substitutes the non-translatable elements like a tax or HTML entities or placeholders in Translation suggested by translation memory by the ones that are used in The Source text this improves translation memory suggestions and allows pre- transations translation memory suggestions for dialects you can also enable that show the primary language translation memory suggestion for dialects if there are no dialect specific ones so if you have a specific language and then you're working with a dialect if you don't have a specific suggestion for that dialect you will also see the translation suggestions for the general or primary language that is very helpful you can use Global translation memory as well to give translators access to the crowding Global translation memory which is a huge fault of existing translations contributed by previous projects remember that with a free account you are donating your translations to crowding a global translation memory so that is great you can also reuse what other people have translated before when this setting is enabled all translations made in your project are automatically committed to the crowding Global translation memory you can also choose the translation Memory Match context type this is these are a little bit more advanced and you might want to take some time to dive deeper into them we're just having a quick overview here so let's just check these ones at the bottom we see some penalties penalties are basically used to decrease translation memory suggestion match percentage based on specific conditions so with translation memory you will see suggestions for a translation but some translations will have a higher priority and some translations will have a lower priority based on how well they match the original phrase or string you can also assign some penalties to that match percentage based B on these criteria that is a more advanced feature but you can also change that in the settings and you can change the assigned translation memories for your project this is something that you might want to use more often and it basically allows you to change the translation memories that you will be using in your project by default you will have your Project's translation memory based on what you have translated for the source files of your project but if you have other translation memories for other projects in your account you can also choose to use that for another project and share them across your projects that is super helpful and you can just select which ones you would like to assign to your current project in the settings and you can also assign them priorities so you will use the suggested translations from the translation memory with the highest priority we will talk more about translation memories more specifically during the course but for now just know that the this is where you can customize everything related to translation memories and over here you can also find glossaries remember that a glossery was a set of terminologies with their definitions a glossery term and this is where you can manage your glossies for your projects in the settings if you had multiple glossies you can choose them or select them from this list you would have several glossies and you can choose which ones will be used for your current project like this this one is Select Ed by default because it's your own projects glossery we're in that project right now but if we have multiple projects with multiple glossies we could reuse them or assign them to different projects and that is great because we will be saving time awesome and now let's just check the last category which is content content settings these are the settings for importing and exporting files and strings and source files they basically help you with your workflow like working with source strings how you want to handle duplicate strings like you can save time by translating all duplicates with the same translation and hiding these instances from translators but this can affect accuracy okay so you can choose what to do with duplicate strings you can also configure how you want crowding to count words in your project like automatically if you want to consider the TX or if you want to skip the TX once you change the option only the newly uploaded words will be counted according to the new settings and if you change this option the new setting that you choose will be saved automatically okay because right here you can see that we don't have a save button but your changes will be saved automatically if I let's say change this to count TX and then I go to another category and I go back you can see that the change was saved automatically even though we don't have a save button right here just to give you that tip and then once we we go to export we can also see that we can save context information in the files we can skip any untranslated strings if we want to this is not enabled by default so we can enable it we can skip on translated files once we are exporting our project we can export only approved translations and we can also automatically fill in Regional dialects from the primary language so for example untranslated strings in Regional dialects like for example Argentine Spanish will automatically include translations completed in the primary language for example Spanish and now we go to labels labels are very helpful because they can add context to your strings and organize them by different topics they can also be useful when you want to search for specific strings because you can filter strings by their labels you can add the labels to your strings here in the settings in the labels category let's see if you want to add a label you just click here on ADD label you write the title of your new label and you click on Save and then you will be able to add the label to your strings let's just check what happens demo label and let's save this now I see my new label over here and I can edit it or delete it if I edit the label I can just change its title and if I want to delete it I can delete it over here delete Del the label yes deleted and I don't see it here anymore but when I am using the editor I can assign that label to a specific string and that can be helpful and finally the last two options are a bit more advanced they are parser configuration to configure how you want crowding to Import and Export selected file types depending on your needs like this let's say for example that your file is in this format let's say that we have a a markdown file over here we see these extensions for a markdown file this would be the set of extensions and the API type here would be this for the markdown file MD you can edit this to change your parser settings you can see markdown parser settings you can enable content segmentation use custom segmentation rules exclude code blocks and these options are more advanced okay they are a bit beyond the scope of this course which is covering like localization fundamentals but I do encourage you to dive deeper into this because it can be very helpful as well as file processors which allow you to customize processing for the supported file formats great these are all the settings that you can customize for your project in crowding so you should have a good idea of what you can customize for your project in the next section we will see a quick review of how you can delete a project in crowding I will see you there and then we will actually start to upload files to our crowding project and we will start translating with the translation editor I will see you there great work now you know how to customize your project settings but let's quickly review how you can delete a project in case you ever need to do this in the future here we just go to settings then general which is selected by default and we go here to the bottom where we see delete project if you click on this button you will be deleting the project permanently and you will be deleting all the resources associated with the project including any uploaded files translations approvals Etc and this cannot be undone deleted projects cannot be restored so be 100% sure please when you click on this button now it's time to start working with our files and so for that we will upload a file to our crowding project I will show you how to do that manually for now since we're covering the basics we will upload a sample PDF file with text and images and you will see how crowding extracts the strings and how we can translate the strings in their translation editor so I will see you there in just a moment so let's continue now we're in the settings tab right but we need to go to the sources tab to upload our files in the sources tab you will see this of course it's empty because currently we have no files to translate but we can use one of these options to upload the source files we can choose to upload files we can also upload our files as Z if we need to upload multiple files we can use crowding sample files and that is helpful to explore crowding works if you want to use these samples at first you can also set up the integration with your repository we will talk about Integrations when we reach the part of the course for developers because you can integrate crowding with your for example GitHub repository with the GitHub integration and import your source files automatically with your GitHub integration right now we're going to focus on how you can do this manually since we're covering the basics and you can also invite a developer to help you with the project setup with this option right now we will be uploading a PDF file a PDF file with with some text that I took from a free code cam article this will be our demo file I will use this to illustrate how crowding takes a file extracts the strings and it can also work with files that contain images so I think this will be a nice example let's upload the file by clicking here you can also choose to add a file by clicking on this button and these are more advanced options okay so basically you would be clicking on ADD file or upload files and you can also create a folder here let's upload a file welcome to Free code cam I'm going to open this file and you can see how it's being uploaded yay so if it might take a few seconds to change while it's being uploaded and processed because remember that crowding has to extract the strings and divide the text into multiple strings and you will see this blue progress bar here you will need to wait until you see a confirmation that your file has been uploaded if you click here or you go to any of these tabs you based on my personal experience right now you will lose the progress that you have for that file so just stay there until the file has been uploaded and voila over here we can see that the blue bar that we had here while we were uploading the file now changed into different options that we have here for our file and we can also see that we uploaded a PDF file but that was converted into a different file format doc X which is like the word format that we use for Word files that is something that will happen when you upload certain types of files crowding will convert them into another format to make it easier for the platform to process the individual strings but when you export them you can choose how you want to export them and over here we see the number of strings that we can translate this particular file has 22 strings with a total of 212 words if you hover over this number you will see the number of words and you can also see the history of file updates here if you click on the option in the revision column you can also choose to update the file by uploading a new version that can be helpful if the file has been modified somehow and you can assign priority for example here we have that the file has a normal priority what happens if I click here well I make it a high priority file it will have a high priority if not it will have a low priority if I click on it again and if I just click on it a third time I will go back to a normal priority that is helpful to categorize files by their translations priority for example you may choose to translate the files of your landing page before you actually translate files deeper in your website or your platform and over here we can see a drop- down menu when you click on the ellipses and we see these options we see add file we see new folder we see create strings fold settings download Source rename and delete if you click on rename you can just rename your file here I could just change it and if I click anywhere outside of the name I save those changes and if I need to delete the file I just click on delete if I click on settings I will see the file settings and that is interesting this is not the project settings this is the file settings let's dive deeper into these settings file details this is the title as it appears to translators you can show descriptive file titles to translators for example you can just assign a more readable name like this one instead of the original file name that may be abbreviated or written in a specific format in your application this file title is only shown in the user interface in crowding and doesn't rename the actual file so when you export your translated files you will still get the original name and here we can see different settings about the resulting file after translation export this is the file name or full path in the resulting archive using the placeholders listed below for example the source file can be resources. Rex but before integration into an application it should be named like this so you can use these placeholders like the language the twetter code the local and you can use the placeholders in the name of the file like this and that value like the language will be replaced in the name of the file that can be helpful to automate the process especially like in software projects where you need to have different names for your files in different languages you can just add the two letters code to differentiate them and use them in your file path that is very helpful this is an example for Android projects like this you can see how it's using the placeholder Android code and the original file name here and other types of projects you can also change the parser configuration like clean taex aggressively translate hyperlink URLs this is also helpful if you are localizing the URLs as well you can translate hidden text translate hidden rows and columns in spread sheets and for slides you can import hidden slides and import the nodes in your slides which can also be helpful if you added some extra notes to a presentation and you can enable content segmentation and use custom segmentation rules these are more advanced options but in the languages tab you can also change file Target languages because you can customize this for each file as well let's say that you don't want to translate a specific file into Spanish you can just disable this for that file and click save and you will not see that file in the Spanish category of your project you can also disable all languages if you don't want to translate it at all or you can select specific languages like this for now let's keep all languages if we read this warning we see that it is recommended not to hide duplicates in the project when disabling languages otherwise duplicate strings in this file may not be available for translation and finally context in this tab you can add any contextual information that will help translators to understand the source text meaning context will be visible for translators in the editor and it also ports marked down and that will be helpful for your translators great so after you configure all of that you can just click save or cancel or just click on this x here to go back and now you know what the file is about we uploaded the file and now if you need to upload a second file you can just click here on ADD file and you will see the option to choose a file from your file system this is how you can upload a file manually remember that we have an option to automate this through Crow Integrations specifically the GitHub integration is one of the most popular ones because you can automatically synchronize the files of your project when you add new strings that have to be translated in crowding that is similar to what we do at free code camp with our open source project so now that you know how to upload your files to crowding manually let's see how you and your team can actually start translating we have the file in crowding so how do we actually translate it that is what we will see in the next part part of the course I will see you there once your file is uploaded it's time to start translating you may start translating the file yourself if you're going to complete the task yourself or you can ask your team to start working on the translations you can assign specific files to your translators and prove readers with the tasks feature that we will talk about when we cover crowding for teams organizations they're very helpful and you can find them here on this tab but for now let's assume that you're translating the files yourself so you can also be familiar with the user interface to start you just need to go to the dashboard tab where you will find all your target languages then you need to select the target language that you will be translating from this list I will choose Spanish for this demo and after I click on Spanish I see the the list of files for the project this is the original source file that we uploaded in the sources tab you will see this file regardless of the language where you click on right because if we go back to sources and we check the file settings like this we will see this languages and right now we have all the target languages selected that is why we see this file in all the languages but let's say that we just don't want to translate this file into Spanish we can save these settings file updated we go back to dashboard and now we see that there are no files to translate you can also do this and choose which languages should be the target languages for specific files you even have that granularity in the settings and permissions great so let's add Spanish again and now let's go back to Spanish and here we have our file we see that we haven't started translating or approving our strings we have 20 and 12 words as to do for translations and approvals so let's start that process by clicking on the name of the file you can also filter files here if you have multiple files you have a very long list of files you can just filter them right here to start translating the file you just click on the name in the corresponding language and that will take you to the heart and soul of crowding the translation editor which is an amazing tool that you will be using daily if you're going to work on crowding when you enter the translation editor you will see these tips like how to view which strings require translations all the source strings are listed on the left side part and colors that know their status and icons next to them the note comments or issues created for these strings you can see if strings are untranslated partially translated or translated and the same statuses apply for approval partially approved approved and hidden if you see a string in grade that is a hidden string you can also collaborate on translations in real time use context to make relevant translation remember that we were able to add some context in the file settings that is helpful for translators and we can preview our translated files we can also make translations from any device because crowding has supported mobile view for the translation editor so you can translate on the go and we also have some different views we will see them in action when we start translating this file we have the sidebyside view and we also have another view that is very helpful to translate multiple languages great now that you know on your way around crowding translation editor you can start making translations you can also check their knowledge base or chat with the team so we're going to close this and now we are in the translations editor remember that when you upload a file crowding takes the text from that file and divides it into Strings which are like the basic units of a localization process this process may require certain format conventions based on the type of file that you are uploading in this case we uploaded a PDF file but we are working with a doc x file which is like a word file and therefore we can work with a strings individually another way here in the translation editor we can see the main layout this is called the comfortable mode in the crowding translation editor we see that we have four main sections or areas we have the left side bar over here we have the Middle top area over here we have the middle bottom area over here and we have the right sidebar let's see what each one of them does and what it has let's start with the left sidebar over here and let's go from left to right the left sidebar shows you all the strings in your file and a preview of your source file you can also enable if you want to see this text translated once you save and approve your strings that is helpful to see a preview of the file in the target language you will find helpful tools for the translation process here at the top you can search for something in a file let's say that I want to find the word certification in my file what do I do I just write it here and I press enter and that will take me to Strings that have the word certification you can see that this string has the word certification this string also has the word certification I'm pressing enter here to jump from the current string to a new one and over here we also see certification but certifications but that also matches our search and if we just continue pressing enter we will go back in a cycle that is helpful to find strings that have a specific term or something that you want to find in a particular file then we also find this tool to load the basic list view if you click on this button the preview will change to this this is a preview of all the strings in the file without actually previewing the file with the original layout and the images it's basically like a simplified version where you can only see the text that crowding extracted from the file you can go back to the previous View by clicking here in the list icon then we find this which is to highlight untranslated translated and approved strings because you can see that the strings here are highlighted in red because they are not translated yet if we just disable this option we see the file as it was presented originally without any highlighted strings we can enable or disable this that is very helpful too you will see different colors for strings with different status then as the third option here we see show the translation preview what this does is that when you enter your translation over here for a particular string like this you click on it you will see the string here and then you will write your translation over here you will see the preview of that translation being replaced here automatically so you will have a preview of your file in the target language of your choice that can be helpful but you can also disable it here if you need to and then we also find a scale toggle option and an option to add a string okay now that you're more familiar with this left sidebar let's go to the Middle top area the Middle top area is where you can translate a string you just need to select it from the left sidebar and the string will appear here will be replaced here in this area where it says Source string like this just click on it and it is replaced here automatically then you can enter your translation over here let's say that we translate it like this Al ccul the free code Camp let's translate it like this let's say here we have the translation and this is what I was mentioning just a few seconds ago that we have a preview of the translation that we just wrote here if we want to disable this and just see the original string in the file preview we can disable this option or enable it to see the preview again like this if you toggle this option and you disable it and you enable it again you might not see the preview unless you make a change okay this is something that is currently happening to me in the platform so if you ever get that then you just need to know that you just make a change and you will see the preview again like this just delete a character and write it again and since you have your translation already written over here you can also use these helpful options from the toolbar you can copy The Source this is helpful in case you have a long string and you just need to make some translations in a few words or you just need to use a large portion of the original string then you can just select this and copy the original string over here that can be helpful when you have for example tags or elements that don't have to be translated and you can just copy them without writing them yourself but we don't have that right now so let's go back to our translation you can also clear the translation by clicking here that will save you time and the third option is to go into text selection mode Let's click here and let's see what it does if we click on this option you will see that the translation memory and machine translation suggestions that crowding is giving us for that string are like in a different color right they are like in a dark greay that can be helpful to just select a piece of the string let's say that instead of writing this final part of the string I just want to copy and paste it from this suggestion this gives me the option to select it from here just copy it and paste it next to the word like this that can save me sometime as well if we don't have this option enabled then you will not be able to select the text individual from these options you will only be able to replace the entire translation one by one so that option can be very helpful when you need to just take a part of this suggestion copy and paste it awesome and over here on the right we find the string length specifically the length of the source which is 37 37 characters here and the target 41 so in Spanish writing this text or translating it like this is longer and sometimes for the user interface of let's say a website or a web app you might want to set a character limit and you can use these numbers to give you an idea of their length great so now that we have this we are going to save our translation by clicking on this button and after we save it now we see that it's highlighted in blue it is highlighted in blue once you have it saved and you will automatic see that you go to the next string the next string is replaced here as the source string and you can just continue editing here you can also see if there is some context for that string you can edit the context and just hide the context if you don't need it but you will automatically go to the next string if you want to go back to the previous string just click on it like this and you can always modify your translations you will also see the history of translations you will see this translation that was saved who saved it my username and when it was saved a few seconds ago in this case over here we also see some options we see Zero because in crowding when you have a project with multiple contributors contributors can vote different translations they can vote to select the translation that they think is most accurate in this case we have zero votes but we could have a vote and usually in the case of fre code cam we also suggest choosing the translation that was most highly voted by the community because usually that tends to be most accurate then then next to the right we also see approve this is a button that only proof readers or project owners or anyone with like administrator access has access to because this will approve the string for the proof reading phase so translators who only translate in the platform and don't prove read will not see this option but you will be able to approve your own translations even though it is recommended to make someone check your translations before you approve them and here we can also see if we can delete the suggested translation and some additional options but right now this option is grayed out so we don't have any additional options here this is what we call the middle button area the Spanish translations the translation memory and machine translation suggestions and you can also see translations suggested from other languages right now we don't have any but we could you can always resize these columns okay if you need to this is something that I also think that it would be important for you to know you can resize them they have a maximum WID but you can resize them and another thing here in the top middle area is that you can go to the next string by clicking on these arrows go to the next or the previous string you can also edit the string over here the original string and you have more options like hi height string from the translators copy the string URL Copy Source skeleton translation history and you can also view the string in context these are all helpful functions that I suggest going through if you have the time when you start diving into crowding more deeply great so now last last but not least we have the right sidebar this is where you can write comments search for the translation memory search for terms in your glossery add new apps and find the apps that you added through the crowding store you can choose the tool that you need to use over here in the right sidebar to the right of the right sidebar first we find the comments then we find the translation memory then the glossery where you can search for specific terms and you can also see some the file context that we were able to add in the settings remember this is the context for the file and you can also add new apps and you would see their small icons over here to write a comment you just need to go to the first option here comments on the sidebar and write your comment on the text input field at the bottom if you click here on new comment let's say that we have demo comment you can also Mark the content as an issue if you need to if this is an issue with a string or with a file you can mark it as an issue and you can categorize the issue it's this a general question is the current translation wrong is there a lack of contextual information is there a mistake in the source string you can choose any one of these categories for the issue for now let's not make this an issue and let's just click here to send the comment demo comment after you send the comment you can also edit it like this and save the changes let me just to make a change remove the period at the end edit it and you can also delete it over here but let's just keep it for now to have it as a sample and that's basically how comments work now if we go to the second option we can see search translation memory with this tool you can search search translation memory for previously made translations and reuse them to ensure consistency here you have some help like excluding words from the search using quotation marks to find the exact combination of words typing an esteras to find words where the end or the beginning may be different you have some examples typing a plus sign and here you have some examples so you have many different options to choose from but let's just search for the translation memory for welcome let's see what we get here welcome we can choose where we want to search search in Source or search in Target where do we want to search for this word if we search in the source language then it would have to be in English if we search in the target language it would have to be in Spanish search option we can also choose a numeric equivalence or guess the translation translation memory result here give us this okay the translation that we just submitted over here this was saved to the translation memory of our project so we can just use it right here and that would also appear here in the translation memory suggestions that is how translation memory works and in the third option we find terminology which is the glosser we can manage our glossies by clicking on manage and we can just go here to the settings and and assign different glossies or create new glossaries we can work with the glossaries in this option in the right side bar we can also search for terms here and we can add a new concept here by clicking on this option in crowding adding A New Concept can be helpful for the glossery we will talk about glossies in more detail but for now just know that you can add a concept and a term for that concept to your glossery and you will see them here in the list and finally the file context right now we don't have any but let's just add some context to show you how this works let me go to my project to sources and remember that we had that in the settings in the settings we find context let's just write something like demo context so you can see if this is updated in the translation editor let's save it the file was up updated and right now if we try to see this in the translation editor by reloading the editor again we see this demo context amazing right we are getting the demo context that we wrote in the settings and this supports markdown formatting so you can just add any context that your translators will need to translate the file accurately based on specific context like where it's located on your website or web application or Android application basically anywhere if you add a context you will also see this like a little warning here warning sign that says file has context provided for translators context can be edited in the file settings model the model is what we were just configuring here in the settings great and if you click here on the plus sign you will be taken to the crowding store when you where you you can add apps and Integrations you will be taken to the crowding store where you can add apps and Integrations for your projects we will talk about Integrations and how you can add them during the course there are multiple free apps and Integrations we will talk about them in more detail during the course but just know that you can add them to your file and project from here great another thing that you should know about the translation editor here is that if a string is hidden like this number over right here which is the page number you will see this tag hidden in the sour string you don't necessarily have to translate it and that will not be available for your translators if you want to Mark a string as hidden you can also Mark it here height string so your translators won't translate it and another great thing that I would like you to know about these tools is that crowding mentions that if the term that you search for or in your terminology tab in the glossery is not available in the actual projects glossery the system will show you Wikipedia explanations so let's write programming for example the term that you're looking for has no matches in the project terminology but crowding is super helpful and it will give you this Wikipedia definition it will give you more context about that term in the target language and in the source language so that is very helpful it will also give you like related Concepts that can be helpful to give you more context about the term and how it should be translated so it is very helpful even if you don't have it in the glossery already you won't be able to understand it without leaving the translation editor that's great for productivity awesome now that you know more about the translation editor and the user interface right now remember that we are in in the comfortable mode so let's talk about translation editor modes in the next part of the course we will see how you can customize the layout in a way that fits your needs because crowding has three options comfortable mode side by side mode and multilingual mode they're all very helpful they're different so we will see them in the next part of the course I will see you there the translation editor has three modes to customize the the layout in a way that fits your needs we have three options the comfortable mode which is exactly what you are seeing right now the side by side mode and the multilingual mode Let's talk about the comfortable mode well it's primarily used for translations it has these four main sections that we just saw and you can switch from this mode to the other two modes by clicking on this button here clicking on the menu icon at the top left of the translation editor then you click on view here and you have two other options side by side and multilingual if you click on side by side you will see that there is a change in how you see things you will see some tips for working with the side by side mode like how to review or make translations you can also approve multiple translations at once which is a bold action that can save you a lot of time if you are a proed reader and reviewing multiple translations you can switch again to the comfortable view to make new translations If instead of reviewing you want to translate and that's all friends so you can close that now this mode is primarily used by managers and proof readers to approve the best translations it's also used by translators to vote translations in a r so if you want to vote on the translations and you want to support the best translations you can do so from this mode but this mode is not usually used for actually translating it's more for a review process we also see four main areas we see an area with the strings their current status here the color tells you the status and notice that here we don't see the strings in Al alphabetical order or in the order in which they appear in the file that is usually why we don't use it for translation it's not really meant for translation you will see that the string that we just translated is actually at the bottom welcome to Free code cams curriculum and we see the translation over here if we click on it we are taken to the string in the preview we can reiz this of course it's another way of looking at the string but by default they will not be in the same order you can click on them and that will take you to the string in the preview but they are not in the same order they're actually grouped by their status so all the untranslated strings will be first in the list and then we will go to the translated strings and then approved strings and so on and here we also see that we have two hidden strings which will be at the bottom here at the top we see these options you can select all the strings for bulk actions on all the strings if you need to for example you can approve all the selected strings you can select them all or or just select some of them and approve them approve their translations in bulk so that's why proof readers really like this mode and here you can also search for terminology in the file let's see certification again we go to the strings that have this word in in the string just like in the comfortable mode that is the search filter we also see filter strings we can show all the strings but by default we see all the strings with the untranslated strings first the show all option shows all the strings in the original order of the source file so if we change this to show all we will see the strings in the order that they appear in the file that is how ful but by default you will see this option you can also choose to see untranslated not approved and approved strings or filter by quality assurance issues the issues that we saw previously that you can configure show the machine translation you can filter strings by strings that have comment strings with unresolved issues remember that we could Mark a comment as an issue we will see strings with unresolved issues for all languages or for the current language That We're translating we can also filter by hidden strings or Define our own filtering and sorting parameters here you can create an advanced filter but that is a bit beyond the scope of the course you can dive into this when you start working with crowding okay it is helpful you can use these Advanced options so now let's use this by default you also see some helpful data about the currently selected string you have the length of the source and the translated string you can save it you can cancel this you can copy Source you can also edit the string and you have more options over here similar to the options that we had in the comfortable mode you can also choose to pre-translated it via translation memory or via machine translation you'll find the string details over here and the suggestions and trans ations and previous translations you can see the translation and when it was submitted here you also have the option to toggle whether to highlight the strings by their status just like we did before and if you want to toggle the translation preview like this show the translated string or not it's basically a different layout but it's more optimized for proof ring great so that is side by side view now let's go to multilingual mode this mode is primarily used by translators and pro readers to work on multiple languages at the same time so for example if you're a translator and you know multiple languages this mode can be helpful to save your time you just need to go here to the menu icon here at the top left and go to view and select multilingual now you will see this when you are a multilingual view you can translate a string into multiple languages so let's say that I want to translate the string into Spanish and Italian let's say you just go here to the menu icon then you go to language languages and you select the languages like Spanish and Italian you can choose up to 10 languages at once you can also search fore language if you have a very long list over here then you choose apply once you apply that but you will see this change in the layout which is like very helpful if you know both Spanish and Italian or any combination of languages you can just take the string for example welcome to Free code Cam's curriculum and write your translation in Spanish here and write your translation in Italian here well I'm not very familiar with Italian myself but let's say that I was familiar with Italian I would be able to write my translation here directly but since I'm not familiar with Italian right now for demonstration purposes I will select a machine translations suggestion let's take this for example if I click here in the icon over here at the right I will be replacing the suggestion over here for Italian and I would be translating both languages at once that can save us a lot of time that's great right so here I have it it's it was added by me a few seconds ago that is also a practical example of how you can add or use a machine translation or translation memory suggestion just click here and have that language selected and it will be added automatically when you're working in multilingual mode you will also have two different options to view the translations you will have a list View and a grid view right now we are in list view which is like personally I would recommend using this and this one over here is a grid view the grid view gives you like more information for each string and you can scroll horizontally through the strings and through the columns and you will see like for each string each string will have a specific key to identify it uniquely in the system and you will see the string labels The Source language the translation in Italian and the trans ation in Spanish you will be able to click here on let's say Spanish translation write your translation over here use the suggestions if you need to and then save your translation so that is another way to translate in crowding when you want to translate into multiple languages at once the other parts of the editor and the tools in this multilingual mode are very similar to the side by side view that you're already familiar with so once you are ready and you want to go back to the comfortable mode to continue your translation let's say that you're just translating one language at a time you have two options to go back to the comfortable mode you can either click here on the menu icon then View and comfortable or you can click here this is like a shorter way to reach the same option here in editor view you click here and you choose comfortable Side by side or multilingual right now we are in multilingual so let's go to comfortable and voila here we can see this and we are back to Spanish over here and we still have our saved translation so that's great now you know how to switch view modes in crowding in the translation editor great work so far congratulations on reaching this part of the course now we will see how you can switch to a different file because so far we have been working with the same file throughout the course now we will see how you can switch to a different file we will see that in the next part of the course at some point during your translation or localization process you will want to go to another file once the current file is translated right that is very easy to do in crowding without leaving the translation Editor to do it you just need to click on the main menu at the top left then you go to file and then you go to open here we have other options let's just go through them quickly we see source file preview translated file preview we also see the option to download the file to export it to upload translations to check all the strings in the file we will see that in just a moment we can also replace in the translations or in sources but right now we're focused on opening a new file or going to a different file when we click there we will see these this list of files and right now we only have one file in our project that is the currently opened file if we had another file we would see it here in the list and we would be able to open it we just click on it we click on open and that will take us to the file just let's click on open and we're there great so if you have a list of files you can choose one but another way to do the same thing a lot faster is to click here if you click on the file name that will be a lot faster you will reach the same option and you will be able to choose a file and open it you can also filter files here if you have a complex project structure awesome now you know how to switch files now let's check how you can view all the strings in your project project as a list you will learn how to do that in the next part so I will see you there you also have an option to see a list of all the strings in your project you just need to go to the main menu here at the top left go to file and then to all strings if you click here you will see all the source strings for that file you will see them as a list you will also o see their current status here we see a string that was translated we see a string that is hidden a string that is not translated and you will also see a different status when the string has been approved let's say that we want to approve a string as a proof reader well proof readers will see this option over here and we can just click here if we want to approve it like this and there we go we see this green check mark that indicates that the string has been up approved this approval can be removed by clicking here remove approval and it will go back to the translated status that is something for proof readers and for project managers but that's basically how you approve a string in the translation editor and you can do that in the three different views and just a quick note before we move on to the translation editor settings is that you can also translate right to left language languages in crowding while some languages like Spanish and Italian are written from left to right other languages like Arabic and Udu are written from right to left crowding mentions that when translating between left to right and right to left languages some elements in the translation field in the editor might not be displayed the same way as they will be once the file is exported to make sure that the translations will be displayed correctly in the exported file crowding recommends clicking Copy Source this button when running the translations this is the first button in the toolbar then translating the text into the target language but leaving any variables or Texs exactly the same even if they do not look the same they will be in the right position when you export the file this is an example taken from the crowding documentation where you can see the translation of a right to left language and how this works you just need to click on The Copy Source button that we saw that basically copies the original string and keep variables and TXS exactly the same while you translate the text so now that you know this let's talk about the translation editor settings because you can also customize the settings of the editor so we will talk about that in just a moment stay tuned and let's go to the next part yes you can also customize the settings of the translation editor to access these settings just click on the gear icon located right here at the top right of the translation editor and that will open the model for editor settings you will see a list of settings that you can customize first of all you can choose to show translation memory suggestions with a minimum match of a specific percentage so if a suggestion matches by 70% of the string that will be shown as a suggestion but you can change that percentage by dragging this slider you can also enable QA issues to check the translations for common mistakes like punctuation tags spaces mismatch missing variables and other issues you can show a PumpUp that attempts to predict and automatically complete the transations while you enter them by default this is disabled but you can enable it clicking here you can also Auto approve if your project role is a pro reader or hire but you're also translating the translations added by you will be automatically approved if you enable this option however it's always recommended to have an extra pair of eyes just in case you have any typos or spelling mistakes or that sort of thing that can happen perhaps after looking at the text for too long we don't even notice that so it's always great to have a backup team you can also choose to automatically move to the next string that is enabled by default exactly what happened when we saved our translation we moved to the next string you can have keep this enabled or disable it you can choose the theme for your editor you may choose to use the Dark theme you may choose the light theme or you may choose the auto theme that synchronizes with your system you can also change the appearance of some of the elements in the editor like compact strings view show only the beginning of the source string so it fits in a single line on the list you can show the translation preview and you have different options here like HTML tags if they display or not so if you have like HTML files and you're translating HTML files and you have some tags then by default these tags will be hidden you can choose to show them hide them or just use this auto option which is selected by default you can also display non-printable characters or hide them they are hidden by default and these are more specialized settings you can find more information about them like translation field highlighting and real time spell check displaying and of course you can change the language of the user interface if you're more comfortable with the user interface in let's say Spanish or Portuguese from Brazil or German or Japanese or French you can choose that and you can change the user interface to your language you can also choose to autod detect your language so that can be helpful if it's more comfortable for you you can customize the settings to fit your needs and another productivity tip that I think is very important for you would be keyboard shortcuts to see all the keyboard shortcuts that you currently have available for your operating system just click on this keyboard icon at the top and that will show you a list with all the keyboard shortcuts for your current operating system right now I'm working on Mac OS but we also have specific shortcuts for Windows and for other operating systems just click on that button and you will see these shortcuts you can also change them because if you click here you will be able to modify the shortcut and you can reset them to the default or cancel the operation now that you know how to actually translate your project manually let's see how you can download the translated files remember that we are showing the basic functionality here we're not automating things yet but this is basically how crowding works for individuals who are working on small localization projects you can choose to automate this task but we will cover that later in the course so let's see how you can download your files we're going to see how you can download your translated files we're not going to translate our entire file we just have this string translated but we're going to choose the settings so that we do download the file with the translation that we have and the rest will be in the source language let's go to our dashboard we click here on our profile image then our username we see a new tab and we go here we see our projects after we reach that we just need to go to our project to the translations tab in the translations tab we will see an option to download the project as a zip file this might be collapsed you will may need to open this but translations will be download loed in the original format according to the export settings if we open this link we see the export settings the export settings are exactly what we have here when we saw the settings top we can choose to skip untranslated strings but we won't do that because we do have some untranslated strings in our file and we want to keep them we can skip untranslated files if we're downloading the entire project we can export only the approved the translations and we can also automatically fill in the regional dialects based on those settings the translations will be downloaded we just need to select a target language that we want to download let's say Spanish and then we have two options either build the the project or build and download if we click on build and download we will see that the build is in progress current language current file so we see a little bit of the progress might take a few seconds depending on the size of the project and then we will see a zip file if we open the zip file we will find a doc x file we uploaded it as a PDF but when we download it we're downloading it as a document a word file or a document that we can open in keynote in Mac OS or another text editor here we see our file but we do see the translation replaced over here so it worked if we translate all of these strings we will see the translated version of the file and that is great you can download it manually like this and you have other options to download it not just the translations tab a key thing to note is that the zip file that you're downloading here will have folders for each language if you are downloading all languages like this if you choose all languages then you will have one folder per language and each folder will have its corresponding files the names of the folders will have their corresponding language codes just a tip so you can identify them when you download them awesome and if you need to download all the translated files in just a specific target language you just need to select the language here like we did with Spanish this will download all the files for that specific language and you also have a third option if you don't want to download all the files in a language and you just need to download a specific file then you just need to go to your dashboard tab select choose the language and then go to that file if you click on the three dots to the right you will see additional options and you can click on download like this you will see downloading over here and then you will find a file in your downloads folder and that file will be the translated version in that language remember that we are selecting the language here when we enter this category in the dashboard tab so crowding already knows what we want to download and that is the translation awesome your download should start relatively quickly and you should have your files ready in just a few seconds or a few minutes depending on your internet connection you can also automate this process of exporting or downloading the translated files with crowding Integrations awesome now you know how to download all the files and individual files in your project so let's dive deeper into the concepts that we have been working with let's see them in practice and how you can work with them in crowding we will start talking about translation memory and how you can create manage download and assign translation memory for your project GRE work so far now that you know the basic features of the translation editor and crowding let's talk about more advanced features like the translation memory we have been working with the translation memory in the editor but now we will see the details of how you can manage that memory remember that the translation memory is like a database of strings that we have translated previously in our project and their corresponding translations this is helpful because reusing previous translations can save us a lot of time so are you ready let's begin let's start by creating a translation memory by default when you create a new project you will have a new translation memory for that project but you can also create it manually you can create one manually let's go back to our profile here by clicking here or by clicking on the drop- down menu if we click here on translation memories on this sidebar you will see all the translation memories that you currently have across your projects for example we see fream project demos TM the translation memory this has one record it's available for these languages English Italian and Spanish remember that we added a machine translation for the Italian string this translation memory is associated to this project if we click on it we can go to that project like this to the settings and if we see more options we can choose to upload the translation memory as a CSV or another type of format we can also downloaded we can edit it and we can view all the records in the translation memory we can see all the records over here if we click here we will see all the records in all the translation memories we can also filter the translation Memories by those that we own or those that we manage we can share translation memories and what this means is that we're going to share all the translation memories across our projects like this if we have this enabled they will be shared or otherwise they will only have the translation memories that we assign to each individual project manually we can also choose a translation memory over here we can select it and that will enable these options we can edit the translation memory view its records or create a new translation memory to create a new translation memory just click here on create TM you will find the TM abbreviation a lot throughout crowding so it's best to be familiar with this abbreviation TM translation memory and remember that Mt is machine translation they're different for the name of the translation memory let's just write demo te M and this translation memory will be in English let's say for now we're not going to assign it to any specific project but we can do so by clicking here on the name of the project if you have multiple projects you will see the list over here so you can click on Create and now you will see this translation memory added to the list now you have two translation memories you can select either one of them and you have your new translation memory in the list so congratulations if you click on a translation memory from this list like this one you will be able to view all the records in that translation memory if you click on this view records button this will show you the source strings and their corresponding translations in all the languages that it's currently available in so we have Italian and we have Spanish like this we can edit each individual r record like this English Italian and Spanish right now um I remember that this is a machine translation so it might not be 100% accurate I'm not familiar with Italian so I am familiar with Spanish and this is accurate but if there is anything that we need to change about this record we can change it here directly for that string we can also delete the record so it's not suggested to us anymore when we just translate if we have multiple records which is what we usually have for large projects like free code camp we can search for specific records here we can match the case we can match whole phrase and we can also find an exact match so these are helpful options that we can enable or disable and combine to our needs to fit our needs you can also upload machine translation if you already have this structure you can upload specific files with The Source strings and their corresponding translations into other languages just click on this upload button and you will be able to upload the file here we can see that we can upload translation memory in these formats xlsx remember this is a format that we saw in the slides at the beginning of the course a CSV file which is a comma separated values file or a TMX file these are the three options you can upload that translation memory and you will have it here automatically and you will will be able to use it in your project here you can see a screenshot taken from the crowding documentation this shows you how you can select the matching columns to their corresponding languages when you upload a file for the translation memory now you can also download your translation memory as an xlsx file as a CSV file or as a TMX file if you click on download just choose a format let's say CSV you can choose to download all languages or just a specific language pair so we have the source here English and let's say that we want to download the translations in Spanish we can choose that language pair and that will work but for now let's just download all languages to show you the file if we open the file uh the CSV file this is what we see we see the source string the language code which is English we see the target language Italian and Spanish and we see the corresponding translation so that is very very helpful in case you need to download it and save it locally or upload it to another tool another great thing about translation memory in crowding is that you can assign translation memory to your project here we have our demo translation memory let's assign it to our project let's go to our home here then to our demo project let's go to the settings tab and then we go to translation memories like this at the bottom you will find the assigned translation memories and if you want to assign a new translation memory a second one you can just enable this here and it will have that translation memory for the suggestions in the project the default translation memory will be marked by the star icon the translation memory with the gray star is used by default and you can also set the priority and one of the key things here about the priorities is that when you assign a few or multiple translation memories to a project you can set the priority for each one of them the suggestion from the translation memory with the higher priority will be displayed first it makes sense right but here a higher number represents a higher priority so if I assign priority to here according to crowding that would be a higher priority than this one so the the suggestions from this translation memory would have a higher priority than this one you can also view the records from each one of them but this is a link that will be opened in a new tab will take you to that translation memory and its records awesome now you know how to work with transl ation memory in crowding this is a more advanced feature so congratulations in the next part we will talk about the gloss series and how you can work with them in crowding so I will see you there awesome now that you know the most important aspects of translation memory on crowding let's check out the gloss series and how they work remember that a glossery allows you to store and manage your projects terminology to help your translators with more context and definitions let's see how you can create a glossery because when you create a project a glossery is automatically created for you for that project but you can create new ones that are independent from any project to create a glossery just go here to this option on the sidebar and you will see a glossery for each project that you currently have but if you want to create a glossery just click here on Create glossery and then you will need to enter the glossery name let's say glossery demo and you will need to select the language let's say English you can also assign the glossery to the projects that you can see on this list you can assign them to projects or not and if you don't assign them you can do that later too let's create it for Now glossery demo you can find the number of terms here here the languages and the projects that each glossery is associated with here you can click on the ellipses to find more options for each glossery you can upload the glossies as xlsx a CSV or tbx file format you can download your glossery in either one of those formats you can edit your glossery view its records and delete the glossery so let's see how you can manage glossery terms in crowding it's important to distinguish between a concept and a term a concept is broader than a term this is what the crowding documentation says about their difference a concept incorporates glossery terms and their variations with multiple translations and other relevant information so you can see the concept sort of like englobes all the terms and additional information to add a concept you select it you view the records over here and you will see that the glossery is empty you can ask translators to create glossery terms or upload a glossery to add a concept yourself just click here on ADD concept and you will see this detailed form for adding the New Concept it has many different options for including information about the concept here we have concept details the definition is the concept definition the subject is a branch of knowledge that the concept is related to you can also add short notes about a concept that translators might find helpful you can add a URL to the web page with relevant information about that concept and finally a figure which is like a URL to the relevant image if the concept is related to an image it also mentions these term details because remember that concept is broader a concept can have multiple terms and if we need to add a new term we can add it over here in any language for each term we will be able to select its part of speech like a noun verb adjective the part of speech the type is like for example a full form an acronym an abbreviation short form phrase or variant the status is preferred admitted not recommended or obsolete you can also choose the gender if the term has a gender masculine feminine common neuter or other you can write a definition for that term you can also include notes and a related URL to important information after you create the term you will see it in the list of terms for the Glasser you can choose what details you want to fill in you don't necessarily need to write all of this for each concept ccept or term even though that is recommended if you have all of this information because your translators will definitely thank you in the future for now let's just write the definition and the term like just to see what we get afterwards if we create the demo we get the new term here in our glossery we can see it here we can see the definition concept details and we can also edit the term and delete it but notice that here we are seeing the term over here the term itself and over here we see the concept that the term is related to remember that concept is broader so this is broader than the actual term in this filter we can search for specific terms and here we can also filter by users with this button we can change which columns are displayed like concept details we may choose not to include it we may choose not to include English or we can also hide all the columns you can also delete a glossery term over here if you need it let's just delete it over here delete this term and you will see that the glossery is empty again you can upload or download a glossery as a an xlsx file a CSV file or a tbx file just click on this button and you will be able to upload it or download it you can also delete glossies here if you go to your glossies panel your glossies tool by clicking on the ellipses and then clicking on delete just delete this and to confirm the that you're absolutely sure about deleting the glossery you need to type a specific number that crowding will give you 419 316 delete and there we go we don't have that glossery anymore now how can you assign a gloss to a project well you just go here to home you go to your project you go to settings and here in Translation you will find glossaries here you will see a list of all your glossies and you will be able to select the glossies that you want to use for your project over here the glossery with the gray star will be used by default for the project you can also share glossies across all your projects by checking a specific specific option here in glossaries if you enable this option share glossies which is similar to sharing the translation memory remember you will be sharing the glossies that you create across all your projects that can be helpful sometimes so you can enable it but it is disabled by default awesome now you know how to work with glossaries in crowding so let's go to Quality Assurance checks in crowding and let's see how they work this is another Advanced feature so so let's dive in now let's talk about quality assurance quality assurance is essential for every type of project and this is especially true for localization projects one small typo or spelling mistake can make all the difference to your users this is why crowding implemented efficient quality assurance features to help you deliver the high quality translations that your users deserve to have in our case is the free code cam Community according to crowding these checks will help you to detect some common mistakes easily and quickly and you can resolve all those issues before you actually get the strings live the issues detected by quality assurance check include typos missing commas Extra Spaces and other common mistakes that you might make while you're translating or that your translators might make let's see how you can configure these quality assurance checks this is done for every project individually you go to your project then to your settings tab and then you go to QA checks in Translation here you will see all the quality assurance checks that you have enabled and you can enable or disable them based on your current needs once you enable or disable whatever you need let's just disable some of them as a sample and then you click on this save button you will see that the settings were updated that's great after you have these settings enabled or disabled or customized to your liking let's just enable everything for now how can you check the quality assurance status of your project well you just go here to your dashboard and over here you can see QA checks currently the status of the QA checks is in progress so the checks are running they are in progress if you reload your project you may still see it in progress but here you will see the status of your QA checks you may see them as off when they are disabled let's just try to disable them for now you can disable them by deselecting this and saving your settings and here if you go back to your dashboard you will see that they are off if we turn them on again like this we save our changes and we go to our dashboard we will see this in progress and after the checks are completed we will see a different status no issues if the checks did not find any issues with our strings or issues found when there were issues found and we will also be able to see these issues when we try to approve a string let's go to our Spanish translation and let's just to test this add an issue to our translation let's add an extra space here this is looking really bad right but let's save our translation for now and when we try to save our translation our quality assurance checks are checking if everything is correct but they detected that the translation contains three spaces in a row we have an option to autofix the issue to save the translation anyway if we are sure that this is actually not an error or to cancel the operation and we can just change this ourselves let's choose autofix this will autofix the translation and then we can save it again what happens if we try to save the translation again well we see this check that says that an identical translation of the string has been already saved vote for the existing translation instead of adding a new one if we save the string with issues like these let's just save this with issues we see that the translation contains three spaces in our Rob but let's just save this anyway and we go back to the string we see that this string has one quality assurance issue the translation contains multiple spaces in a row that will be helpful for the proof reader who is going to check and approve the string and we can also see this if we go back to our project and we check the status the quality assurance checks are still in progress but after the process has been completed we will see that there were issues found and we will be able to fix them in the strings that is the power of quality assurance checks now after I approve the string the string is now in green because it has been translated and approved this is a sample image from the crowding documentation showing what you would see if the quality assurance issues are found in your project you would see something like this quality assurance is a very important step that you should definitely take very seriously during your localization process so now you know how to enable them and work with them in crowding let's continue in the next part of the course we will see how you can upload existing translations you will have three different options so we will see them in the next part of the course I will see you there if you have existing translations already written in a specific file format you can also upload them to your project and use them directly you have three options you can upload them via the translations tab over here you can upload them via the specific language page or you can upload them via the translation editor we will see a three options you can upload translations from this translation tab by clicking here upload existing translations if you drag existing translations here you will be up uploading them and you can upload them from your file system according to crowding the supported formats for uploading translations include those that have a key value structure such as for example Json or Android XML Mac OS or iOS strings and there are many different formats here you can find a list also CSV files are accepted and crowding also mentions that for file formats that do not have a defined structure translation upload is handled bu by an experimental machine learning technology so when they say experimental that means that it might not be 100% accurate great that is how to upload it from the translations tab you can also upload them from the language page you just go to the dashboard tab then you click on a target language and then you click on a file but instead of clicking on the name of the file itself you will click on the three dots to show more options and then you will see upload translations you can allow Target translation to match the source you can approve added translations or you can translate hidden strings those are options that you can enable before you actually upload your file just click on select file and you will see your file system an option to select the file from your file system and that will upload the translations for your file and finally the third option is to upload via the translation editor if if you double click on the name of the file and you go to the translation editor then you can click on this menu and then in file you will find the option to upload translations you will see the same three options and you will be able to select the file from your file system awesome now you know how to upload translations there are many supported file formats on crowding for all of these operations because so far we have mentioned many different file formats during the course that you can work with in crowding but actually crowding supports more than 100 file formats you can view all of these formats in the crowding store over here all of these formats are supported by crowding you can filter the list with this search bar you can also filter them by author or by tag and you can sort them by relevance name and date you just need to go to support. crowd.com /s supported format and then you click on this button view on crowding store that will take you here to this list and there you will find the catalog of all the formats that you can use and work with in crowding it and it's very helpful for any type of project great now you know all the supported file formats so let's talk about pre- transation remember pre- transation it was a way to translate your project files automatically when you upload them so we will see how you can enable enable that in crowding now let's talk about pre- transation if your goal is to save time and improve your productivity pre- transation through machine translation can be exactly what you need this is an automated process that applies computer generated translations to your project when you upload a file and you can set that up in crowding in cring you can customize machine translation engines to use this feature you have two alternatives to implement the process you can do it either manually or automatically so let's talk about the manual pre- transation to configure pre- transation for your project you just go to your project to your dashboard Tab and then here you see the option for pre- transation remember these acronyms I told you that their difference was going to be very important because crowding uses these acronyms very often and they are very similar so at first you might find them a bit confusing but remember this is translation memory and this is machine translation if you choose to pre- translate via translation memory you will be using the database of existing translations from your project and if you choose via machine translation you will be generating the translations automatically if you choose via machine translation you will need to choose a translation engine by default you will use crowd translate but based on your current plan you might be able to choose another translation engine like Google translate or Amazon translate or any translation engine that you need you can choose the target languages you can choose different files and you can filter by labels and exclude labels so that is what you can do to set up pre- transation via machine translation you just choose your target languages choose your files and you can see that this enables the button for pre- transation Via machine translation this will give you automated translations translations generated by a computer by an artificial intelligence model that your proof readers should check before they are approved but it can save them a lot of time if you automate this process because they will have something to work with and they can just modify them you can also enable this for specific Target languages if you don't want to do that for all your target languages and you can do that for specific files you can use these search filters to filter the list if you have a complex project structure if you choose to automate the process the system will pre- translate new content automatically and another great thing is that you can set up pre- transation via translation memory if you have to use translations from your database of previous translations if you have shareed translation memories option if you have that option enabled all the translation memories from the projects you own or manage are already shared so you can pre-ra using them you can select the target languages for which you would like to use this automated process and select the files you can also set the minimum match ratio to translate only if it's a 100% match you can skip any approved translations apply for untranslated strings only this is very helpful and it is selected by default so you don't end up translating strings that were already translated and you can also approve added translations but only if they have like for example a perfect match a perfect match that was approved by a pro reader previously or you can just approve all of them skipping Autos substituted suggestions or all of them by default if you enable this option you can choose either one of these options you can also filter by label exclude labels and you have these notes for auto substitution and prioritize translation memories in the settings tab how you can assign and prioritize the translation memories we talked about that in a previous section right how to assign them a specific priority if you set this up your files will be automatically translated then you can open the files in the translation editor and and just check the automated translations but you will have something to work with immediately and that will save you time great that is how you can work with pre- transation in the next part we will talk about offline translations because sometimes you and your team will need to work offline crowding has a great feature for this and we will talk about that in the next part of the course now we will see how you can work with offline translation because sometimes you and your team may need to work offline crowding has a great feature for this you can download your files for situations where you may not have access to the internet or you may like to work with the files locally and then upload your translations to enable or disable offline translation for your project you may choose to disable it as well you just need to go to your project then to the settings tab and then privacy and collaboration after after that you will find this option allow offline translation this allows translators to download the source files to their machines and upload translations back into the project project owner and managers can always download sources and upload translations so this is basically for translators and prove readers owners and managers will always have this option we can enable this or disable this each file can be downloaded individually in two different ways the source files you can download the source files themselves to translate them locally and then upload your translations you can download them via the translation editor or via the language page let's see how you can do that via the language page just go to your project to the dashboard you select the language let's say Spanish and then in the list of files click here on the three dots and then just download it if the file has not been translated you will will see the original source file because if you assign that task to a translator and no one has ever started translating the file you can just download it and you will see the original file in English if someone has already started translating the file you will see the translated version with the translations that have already been approved like this but if you haven't started translating the file that will be exactly the same to the original source file that is the first option but you can also download the file from the editor let's just go to the editor by double clicking the file here and let's open the menu you will see the option to download from here you will be downloading the file you will see it in your list of downloads and if you open the file you will see the file over here with the translations of course but if you haven't started translating it that would be the source file awesome now you know how to download individual files for offline translation you can also download all the files for a specific language in your project if you want to download all the source files let's say that you need to translate for Spanish you haven't started translating them yet then you can click here to download or upload download translations upload translations and you can export them in this format awesome now you know how to work with offline translations that can be very helpful for you and your team now let's see how crowding can help you if you're working with a team on a localization project or perhaps you're the founder or manager of an organization that is interested in localizing a product and you will need to work with team members let's see these features in crowding first we are going to see how you can invite project members and contributors to invite members to your projects go to your project and then go to the members tab once you're in the members tab you just need to click on the green invite button you can also click on this button and then you will see the option to invite people you will need to enter information for these options before sending the invitations first you need to select a specific role then you need to enter the emails or or usernames because you can invite multiple members and afterwards you will find a default message here you're invited to join the project and then you will see the name of your project here by default but you can customize it to your liking or you can just leave it blank if you want to but of course it's always best to be kind to the new team members so I would keep this or customize it let's see how this works if you click on select role you should see something like this you will see all the available roles that you can assign in crowding by default the translator role will be selected because this is what we will usually assign for team members right translators they can translate the content and vote for existing translations you will also see these roles manager developer translator proof reader and language coordinator we will talk about these roles in more detail in just a moment but here on the right you will see these fields in these fields you can assign specific languages for which you would like to assign these roles to that member or those members for example you could assign the role of translator for a particular contributor for the language Italian and you could also assign the role of proof reader to that same contributor for Spanish or you can assign both languages Italian and Spanish so the contributor would have these roles for these specific languages but if you want to assign the role of proof reader or translator for all the languages that you currently have available on your project you just leave this empty we will talk more about member roles in just a moment once you're ready you just click save here and you go back to the main options for now let's just assign the role of translator for all languages okay let's click on Save here and we go back to our invite people form let's just write an email here to send an invitation you're invited to join the project free code cam project demo if you click here on invite you will send an invitation to that project member but there is another way to invite that member you can also send invitation links if you click here on get link you will also have the invit URL copy to the clipboard and if you just copy and paste it let's just copy and paste it on a plain text file to preview it you can see that it's a URL a crowding URL with your project and then it has a specific invite code when the new team member clicks on this link they will be able to join the project with the permissions that you granted them and after you get a link you will also be able able to manage links by clicking here manage links these are the links that you've generated so far here I clicked on the get link button twice so I have two links you can see that the times are really close and you can see the roles assigned with that link for that member and you can also click here to copy the link to the clipboard or you can also revoke the link let's just revoke this as a test and it's removed from from the list of links that we currently have available if we click here we just copy the URL to the clipboard and we can paste it anywhere we need to like an email or a chat anywhere where we want to send the invitation to the team member once we're ready managing the links we just click on done and let's also test how the invite button works I am going to send an invite to one of my emails to my one of my accounts select the role of translator and with this default message let's click on invite over here and I see that one invitation was sent successfully now if I go where I received the invitation like I am seeing what a member what a normal member would see in might take a few minutes two or 3 minutes and then I got the invitation to join the project to join the translation project this is what the new team member would see when you send them the invite hello the Stefania demo in this case the project owner invites you to participate in the free cam project demo translation project at crowding here we can see the default message that we sent with the invite of course it would be great if you customize this to invite your team members and here we see a link get involved if user clicks on it they will be taken to the project and they will be added to the project so let's open this in in an incognito window because right now I am in my crowding account so I have to simulate as if I have no relation to that account I am just a normal person what I see is that I have been invited to the free code cam project demo project with the following permissions as a translator I can sign up for free or log in and I will automatically join the project so if I create that account and I join with that link I will be able to contribute to the translation project and just to have one contributor and I so that I can show you all the different features of how we can handle team members I'm going to do that with my second account I have two accounts on crowding one with the project and another one to simulate a contributor so that's what we're going to do next now you know how to invite new contributors you just select a role you write their emails or usernames like sample gmail.com and then you just write the message send the invite or you get a link great so I am just going to sign in to my other account accept the invitation and I will be right back to this project this is my second account this is the other account that I created on crowding and this is what I'm going continues to simulate being a new team member let's say that I received this invitation by email and I just clicked on get involved I created my crowding account and after I click on that link I see this welcome to Free code cam project demo translations you have joined the translation team you can leave this project if you don't want to participate in the translations so if you click here you will leave the project but since you joined this is is what you would see as a contributor and now that we have this new contributor in our project let's just go back to our project owner perspective this is from a contributor's perspective we just accepted the invitation we're part of the project now but what will you see if you are the project owner that is what we will see in just a moment let me go back to my project owner account estefania demo and here I'm back with my my project owner account here I can see my project I own one project but now we do have an an important change now if we go to the members tab we can see that we have another account another member of the team right now Stefania demo is the project owner account it's my account my personal account where I created the project this is the owner but this is a translator I just used my name here but it could be any team member that I added to my project okay what can we do with this once we have our team member already signed up for a project project roles can play a key role in this platform as well because you can grant different permissions to your team members now that you know how to invite them let's see how you can change their project role we can find more information about the different roles that we can assign by clicking here on invite and then clicking on the role this will give us more details about each role in crowding and what it involves a manager has unlimited control over the entire project developers can upload files edit translatable text connect Integrations and use the API they cannot manage project tasks members and reports that is reserved for managers and and project owners but they can work with the files translators can translate the content and vote for existing translations usually when you add a team member the new member will be a translator by default and then you can upgrade their role to Pro reader and Beyond Pro readers can translate and proofread the content they are in charge of checking that everything is okay with the translations and with the localization process and finally we have language coordinator language coordinators can manage people of selected languages because here we can also assign these roles for specific languages remember so we can also have language coordinators for specific languages to assign a specific role to a member you can either select the role here in the invitation when you invite that team member and you can also select the role on the member's profile page let's see how you can do that because you already know how to select the role here on the invitation if you grant manager the manager role by default that will have unlimited control over the project so all of these will be like marked by default and they are gray out okay but if you go here below you can assign the different roles individually as well so now that you know how to do this in the invitation let's see how you can do that in the memb profile here we have estefania CN this is the username of my team member if I double click on this member I see member info this is like a summary of that member in the project it's very helpful here you can see the profile image the username the roles that it currently has assigned how you can also click here to contact that member when the member joined when it saw the project for the last time and how many strings the user has translated approved voted and commented we see that please note that this data only shows current contributions removed ones are in display here here you have some options for that user remove contributions remove contribution you can open profile remove from Project or block a project because yes if you need to you can also remove or Block members from your project because sometimes things may go wrong with someone in the project so if you need to block their access entirely you can do so from here and here in the permissions tab you can also change their roles right now we only have translators selected but let's say that I want to upgrade this to proof reader and I want to make this contributor a proof reader for Spanish I can let's say that this team member can translate and prove read in Spanish so I would just add the language here and select that rle approv reader and select Spanish over here and after that I just need to click on save like this and then done we need to click twice on this button first to save and then to close this done like this and now we see that the project roll has been updated like this we see translator and then a shortened version of Pro great so now you know how to change the project role you can do that on on the imitation itself or if you already invited the member remember that you can just open the members info and change the permissions awesome in the next part we will talk about project managers they play a key role for the team and for the project so we will dive into the functionality that was specifically designed to add and manage project managers in crowding we will talk about this in the next section so I will see you there project managers play a key role for your team and for your project they can have unlimited control over the entire project and they can help you to coordinate and assign tasks to team members we will talk about tasks in more detail in just a few minutes in an upcoming section but now let's focus on Project managers and let's see how you can add a project manager to your project you can assign the role of manager here in the invitation you just click on the roll and you select manager here the manager has unlimited control over the entire project and alternatively you can also add managers by going here to managers on the left sidebar and if you click here you go to managers you will see that there are no managers yet invite project managers who help you manage your projects in crowding you can modify permissions for a user at any time and this is where our member account Stefania CN will come into play we will grant our contributor manager role if we need to invite a new manager for our project we can click here on ADD manager we will need to enter the email or username of the manager that we are inviting writing we can also write a message and we can set the manager's permissions if we want the manager to be able to manage the projects the translation memories and the glossaries we can click this to select all of these if we had multiple projects here we would see a list with all the projects and we could select specific projects for that manager we can also choose specific translation memories for that manager to manage and we can also select specific glossies all the translation memories and glossies that are assigned by default to a project are also marked by default okay here we have our only demo project that is one way of inviting a manager but we can also promote an existing team member to manager and we can do that here by going to our project then going to members and then just changing the role of that member we just double click on its user name or click here on details we go to permissions and then we select this manager the manager has unlimited control over the entire project so we save this we click on done and now we see the project role of manager again if we go back we see manager and now the role has been up updated here if we go to the managers section here on the sidebar now we see this user as a manager and it's the manager for this particular project from this list of managers we can also edit the manager's permissions and everything Associated to that manager if we click here on the ellipses we see edit permissions and remove we can remove a manager we can edit permissions and if we edit permissions we see this we can change the permissions for specific projects let's say that we don't want this manager to have permissions over this project anymore we just unmark it uncheck this or if we selected multiple translation memories and now we want to remove those permissions we can just update this and save the changes we can also go to that user's profile by clicking here it will be opened in a new tab like this so let's just save this and voila here we have the updated manager you can also remove a manager by clicking here on the ellipses and clicking on remove we are asked if we would like to remove this manager we can click here on remove or we can click on cancel for now we're not going to remove the manager but just know that you can do that anytime you need to with the ellipses and remove there is is an important difference between a manager and a pro reader on crowding managers and pro readers have key differences in their roles and permissions to explain this in more detail we can go to crowding knowledge base you can find that at support. crowding docomo project participant roles QA this is this article managing roles of project members and then you go down here to Q Q&A questions and answers this is important I think to know the difference between a manager and a pro reader the question says I'm a project owner do I need to invite a manager or a proof reader what do I need the main difference between a manager and a proof reader is the following in addition to approving translations added by translators managers can also invite and remove project members so they have higher permissions upload source and translation files to the project set up Integrations Etc so they have additional permissions than just approving the translations if you want to have a project member who should have access to the features mentioned above you need to invite a project manager alternatively if you plan to manage the project yourself it will be enough to invite a proof reader so that is the answer to the question the difference between manager or proof reader awesome now that you know more about project managers let's talk about tasks because tasks in crowding can help you to stay organized and manage your projects more efficiently we will see them in more detail in the next part so I will see you there let's continue organization is the key to success in any project and crowding definitely knows this because they Incorporated very helpful tools called tasks on their platform to help you organize your project and coordinate tasks among your team members with tasks you can assign specific files to your translators and proof readers you can set duat for specific tasks you can receive notification discuss specific task with other team members and even split a task among different team members you can also track the status of each task in a board where you can drag and drop your tasks from one status to the next that sounds great right it's a great tool for tracking the progress of your project so let's see how you can actually create them and work with them in detail to create a task you just need to go to your project and then to the tasks tab over here at first of course this will be empty we won't have any tasks but don't worry we will take care of that in just a moment we're going to create a task to do that we click here on the green create task button there we will see new task please note that a task can only be assigned to one project so that is why we have the tasks tab within a specific project all the tasks that you create here will be applied to that project let's try to create a new task what kind of information can we enter we can enter the task name let's say for example translate the welcome to Free code cam file let's just add this name and we can enter a description we need to translate the welcome to free codam file as soon as possible just as a demo description you can of course customize this to your liking then we see the type what is the type of task well we can translate the the file or complete the translation by our own translators we can prove read it by our own prove readers but for now we're going to translate it by our own translators we can set a du weate let's say that well right now we're in December 2023 so let's say that I want to have that file ready by December 8th we can set the time a specific time we can change the hour here with the slider and we can also change the minute that's really nice right we want to have this ready by let's say 10:30 great so after we have that we just click somewhere outside the calendar and we can move on here we have an option for the strings the task will be assigned or will be related to all the untranslated strings or we can also set a specific range uh date range for the strings that will be assigned to the task for example all the strings that were modified today all the strings that were modified in the last seven days this is helpful for reducing the scope of the task the because remember that you will be assigning this to translators and proof readers so they should have a clear idea of what they should be working on so this just helps you to narrow down the scope of the task or you can just select all the untranslated strings and keep the task Broad and open you can filter by labels you can exclude specific labels for the strings you can skip strings that are already included in other tasks that is also very helpful if you select this you will be skipping strings that are already part of other tasks to avoid any duplicate work from your translators so you can select this option which is broader but still avoid duplicate work with this option and then we see the files here you will see all the files of your project you can also filter with this search bar and to select on a specific file you just click here to select the file here you see the number of words and you will also be able to assign a specific language for the task or multiple languages if you need to please note that if the task has more than one target language here then the system will create a task for each language and just to show you that I'm going to select let's say Japanese and Spanish we're going to see this after you select the target languages you can assign spefic specific team members to the specific Target languages for example let's say that I want to assign a team member to this task in Spanish I can click on assign and I will see a list of my current team members of users in Spanish and I will select this one my team member account okay so if I select this user I have it here in the list and if I have like hundreds of users here I will will see a very long list and I can search for users here using the filter I can also like show managers show developers language coordinators proof readers and translators if I just click on one of these I will be filtering the list show translators show prove readers and based on whether we have the check mark here or not that means that we are showing these roles here we're show for example here we know that this is a project manager right so you can filter the list like this and you can also split files split files is interesting it's an interesting option because if you would like to assign multiple team members to the same file to work on different parts of the file like let's say that you are translating a very long article and you want two or three team members to work on the same file but without any overlapping work you can split the files and assign them to those specific strings if you split the files you will see this the approximate number of words that they will be translating and you can see unassigned words and we can clear the list by clicking here on the trash can we can also deselect members by clicking on their name let's click on apply here and now we see the profile image of the user that we just assigned and if we hover over the profile image we will see the username awesome so let's keep this task as it is translate the welcome to Free Goan file this is the welcome to free file so this is like a basic task but of course you can customize this to your liking let's create the task great task created successfully awesome we have three different categories a to do category an in progress category and a done category these are like the different status that a task can have for now we have this task one task in Spanish and one task in Japanese if we click on the language we will be expanding the details of the tasks and we will see the maass individual cards we have the same task per language if we select multiple languages so they will be kind of independent of course they will have a different number of words based on the the language and the source files and everything everything let's check out the details of a task here in spanish if we click on the task we will see more details like the language this is the description this is the title this is the number this is the task number that we can use to identify it the type of task we see when it was created modified the due date we also see how many files it has the number of words and strings mod if IED if there is a specific time range for the strings we see who created the task the username and if we click on it we will be taken to that profile we see the members of the task assign words and how many words are left and we also see some actions like view strings and Export at the bottom we find two sections here we can see the files related to the task and we can also write a comment this is help because we can keep conversations related to a task on the task itself that is very helpful let's say we need to work on this file just as a demo comment if I click on send here I can add my comment I see the username when it was published and the comment itself here at the top we see three options to do in progress and done and that is very curious because those are the three three categories that we saw here in all tasks if we click here we go back to the main boorn to do in progress and done and actually that is one way to change the current status of a task if the task is already in progress we can click here and the task will be updated to in progress if we go back to the main board we will see it here in the in progress category of the board another great feature is that we can drag and drop the tasks like this instead of changing them inside the details we can just change their status like this or we can do that from here manually and we will see them updated as well once a task is done we can mark it as done here like this and we also have the option to close a task there is a difference between a task being done and a task being closed it's not the same the task can be in the done status or category and still you will need to close it and you will be able to see all your closed task if you click here right now we don't have any closed tasks so let's just close one now and now it's disappeared from the board we only see the Japanese task we don't see the Spanish task anymore but if we go here to the closed status we see the task over here if we click on it we go back to the details and we also have an option to reopen it if we click here on the ellipses reopen we can also edit the task and delete it if we click on reopen we will be reopening the task and after we go back to our board we will see it again reopen the task so that is how you can update the current status we also have other options over here like exporting and uploading translations we can view the strings related to the task in the translation editor and here in the ellipses we can edit the task we can close it and we can delete it if we click on edit we will go back to a form that is very similar to when we created the task initially we see the duate when it started when it was was resolved we can filter by labels change the files change the target language assign new team members for a specific target language and we can also reset the task scope and progress but the progress for the files will be reset as well so be careful choosing this option great now you know how to edit and close a task you can close it directly from here as well you don't necessarily need to close it from the board it will we click here on close we will see that the task was closed just as before and we can keep it closed or we can reopen it once the task is closed you will see when it was resolved you will see all the comments as well they're all kept there so you can see the previous discussions that you had and you can reopen it like this that's why it's also great that they're independent because you can have independent conversations per link language and now let's see how you can actually delete a task because so far we've created managed and closed tasks so let's see how you can actually delete a task this is the Japanese task that we created let's follow the normal workflow that you would follow for a project first you created as say you to do then let's say that you move it to the in progress status then to the done status and after that you close it once you close it you can keep it here or you can also delete it you can also delete it before closing it but usually when we create the task is something important so we delete it if we created it by mistake or if we made a mistake we can also edit it so we click here on delete and we see delete the task translate the welcome to fre Cod cam file if the task is completed you can close it or or Mark as done so for now let's check how this is deleted by clicking on delete and we see that the task was deleted successfully awesome let's see how you can go to the translation editor directly from the task let's say that this was assigned to me and I want to start working on my strings if you need to go to the translation editor you can just click here on view strings and that will take you to the translation editor for your project in the knowledge B crowding mentions something very important about tasks here we see this question how do the source file updates affect the existing translation and improv reading tasks that is very important for for a project that is constantly being updated like for example a platform like free code cam we're constantly updating the curriculum and different resources let's see after the source file update the list of source strings included in the task will be updated in the following way the strength removed from the source file during the update will be removed from the task the modified strings that are marked with the keep translations option will appear in the task with the new modified text and the newly added strings won't affect the existing task in any way if the source file is restored to the revision containing the removed strings they will reappear in the task so so this is how crowding handles these constant updates to the source file great now you know how to work with tasks as a project owner or a project manager reports can be very helpful for understanding your team's current progress and activity crowding has a reports feature where you can track and check your project status to access the reports of your project project go to your project and then to the reports tab there you will find very helpful and graphical reports about the status and activity of your project here the first thing that we can see is that we have the project status and your Top members we will focus on the project status and the Top members here we find the size of the project how many words it has how many translatable words because remember that some strings are hidden from translators they're not translatable so that is why this number is different we have the source language how many Target languages we have how many members we have and how many managers we have we also see the progress bar here translatable hidden and duplicates we also see this bar here with the number of translatable hidden and duplicate words and over here we have interactive Graphics which are like super helpful I mean let me show you how they work you can see your translation activity prove reading activity and sour strings activity in specific periods you can filter them by day by week by month or by year let's keep the month range and here we can see the number of translated words and how that has changed in the period that you selected the number of approved work words new members active members and here we have an interactive graph with dates the Blue Line the blue graph is the number of translated words the green line is the number of translated words by translation memory and the light blue graph are the words translated by Machine translation over here so you can see all these three statistics per date you can also see proof reading activity by approved words and votes and Source strings activity by added words deleted words and updated words and if you ever need to check the performance of your team members and find the Top members to congratulate them or reward them you can go to Top members here and you can select a date range in the calendar you can just select a date range and generate the report like this that will filter the list to give you your Top members for that date range let's select this one right here and it's very easy to select the range because once you click on the day and you just need to move your mouse to expand the range like this let's start here from November 19th to December 3rd and generate the report and now you see that the date range has been updated and over here we can see the users this is my project owner user or account and this is my sample member account like this is a contributor we can filter Top members by language remember that we have six Target languages here let's say Spanish we have this one and we can also change the layout of the presentation like this we can choose which columns we would like to include the username languages that the user translates into number of translated words Target words approved voted and if we just deselect one of these you will see that the column will disappear this is helpful to customize the layout and the data that you will be getting if you would like to export this report as a CSV a Json or an xlsx file you have these three options to export this table you can also include the number of Plus or positive votes received number of negative votes received winning and joined when the member joined the project you can also scroll horizontally if you add all the columns but by default you will only have the basic ones the other ones you can add them as well and you can change the page here if you have multiple Top members by clicking on these arrows right now they're gr out because we only have one but if you had multiple Pages you can change the page here and you can also filter the user by the username by using this search bar great another great thing about the project status here is that you can choose the unit of this report if you would like to measure the performance in words you can do so but you can also change that to Strings number of strings now instead of words we will see translated strings approved strings and everywhere where we had words now we have strings instead and the data will be updated appropriately we have strings words characters without spaces and characters with spaces but by default wordss will be selected in the crowding knowledge Bas in the project reports article you can see a sample of these graphs for an active project like this one you will see the three graphs the total translated words the words trans translated by translation memory and the words translated by Machine translation this is what a project like freom would look like for example once it has some activity during a time period and for Source strings you will see it like this number of added words deleted words and updated words in blue that's also very helpful but now we see it as a sequence of bars instead of a line graph awesome so now you know how to gen generate reports on crowding and how to export them when you need to you can export your list of top members if you need to and check your project status so let's dive into conversations and crowding because communication within a team is very important and you can communicate with your team members directly on crowding with this feature so I will see you in the next part of the course let's talk about conversations communication is essential for any successful project you and your team members can communicate directly on crowding with the conversations feature with this feature you can communicate with one or more team members in a private chat each conversation has a subject so you can easily find them among all your conversations so let's see how this works to access your conversations you just need to click here on this icon we see no unread messages right now but that will take us to create a conversation to create a conversation first I need to search a user by name or username I can also filter users by contacts or by the users of all my projects I can filter my users by their roles as well if I know that I need to talk to for example a project manager I can just select all the project manager ERS I can select translators and I can also filter by language if I want to get a list of all my translators for Spanish let's say I can do so like this right now I don't have any I have one manager which is my other account to show you all of these features how this works with two crowding accounts once I have that user here I click on the user and this is added to my list and then I click on go I can remove the user if I don't want to include it by clicking on the X then I click on go and now I see a new conversation the conversation can have a subject or a title that you can use to filter and find that conversation so let's say let's say that I want to talk about creating a new glossery for example just as a demo I can write create a new glossery as the subject and I can save my subject create a new glossery I see it here in my conversations and I see that this conversation only has one invited member which is my other account and here I can just click on the gear icon to change the subject it's like editing the title okay and over here I can see that today Stefania demo my main account created the conversation and edit one user like this I can also see the time when this happened and if I need to I just write my message over here it's very intuitive let's say let's say do you think that we should create a new glossery for the project and after I write my message I click here on send and there we go I have my new message here and just like a normal chat application that we use every day we will see all the messages vertically in the order that they were sent and we also have additional options for each message we can share a message we can mark it as unread for us to review later later on we can edit the message and we can also delete it if we are the ones who sent the message we cannot edit or delete messages sent by another user let's say that I need to edit my message I can just edit it here let's just add the word hello hello hello do you think that we should create a new glossery for the project here and we if we edit the message just know that this will be added at the end edited and we can also delete the message like this if we click here we will see a confirmation message delete this message the action cannot be undone so we just delete it and it just disappeared another great thing is that we can filter conversations we can search for something in conversations by writing the text that we're looking for in the search bar and we can start a new conversation by clicking here on create conversation again the same process we filter the list we write the name or username we select the users and then we click on go to start a new conversation so that is basically the conversations feature and how it works great so now we're going to start diving into Integrations what are Integrations how can we use them how can we add them to our projects and what free Integrations can we use in coding let's see here we have our previous project the free codam project demo but for this demo I'm going to create a different project so we can actually work with the Integrations and import our file instead of uploading it manually like we did before we're going to create a new project really quickly project project name Integrations demo free go camp Integrations demo like we saw over here public project visible to everyone you can restrict access to specific languages after the project is created so that is very important too let me zoom in over here so we can see the the text better we already created a project previously during the course so I'm going to work through this a little bit more quickly Source language English and let's make the target language Spanish in this case okay we're going to make the Spanish and then we're going to actually create the project freeo cam Integrations demo public project I already have one private project so I cannot create more projects because I have the free plan I activated the free plan after the trial so I'm going to make this public by default okay this option will be great out then I create the project of course we can always change these settings now now we see that we can add files for translation to this project but we're going to do that through an integration when we have our project over here like we saw before we can go to the Integrations Tab and with a free plan we can add one integration how can we do that we go here to this button add integration there are hundreds of Integrations that you can choose from it's very important to choose the right one because on the free plan you can only use one at a time so for this this example I'm going to show you something that is very commonly used like Google Drive we're going to use the Google Drive integration so you can Import and Export files directly to your drive folders that you can use with your Google account if we click on the integration we will go to the description page where you can find an overview the features at a quick lens you can also find usually like a tutorial recorded by crowding and how to set it up you can Import and Export trans translations manually but it just takes a few clicks so we will see how to do that in just a moment it's free so we just need to click here on install and we will install it install if we install this application Google Drive the application will have access to our projects and it will be displayed in the project menu Integrations Google Drive select the users that will be able to use this app you can choose if only you will have access to this app all project members or you can also select specific users if you had more users here you would see a list you can select them and you can filter them then you would click on select or cancel for now let's select only me then select the projects where users will be able to use the app projects you own or selected projects this will allow you to use this integration in all the projects you own or you can also select specific projects let's just select the free cocam Integrations demo because we don't want want access to this in the project demo so let's select this selected projects and then we install it let's install it like this and we see a confirmation message installed awesome right then of course we can click here again if we need to uninstall it at any time after that we have it installed let's go back now if we go back to the overview of the apps and Integrations now we see that it is installed because we see this install button awesome so after that we just click on the X icon and if we refresh we should see our integration over here in the Integrations tab Google Drive if we click on details we can see this over here this will prompt us to log in with Google drive here I'm working with a demo email a Gmail account so I'm going to log in with Google drive after that I select the email that I want to link I click here and then I see that crowding integration wants access to my Google account when you allow this access crowding integration will be able to see edit create and delete all of your Google drive files so make sure that you are granting this permission knowing what the application can do on your account okay make sure you trust this integration and then continue after you have the integration set up you will see this it's a actually quite easy you will see the content of your drive here I have a folder that I created on my drive manually and if I expand this I see the welcome to Free code cam PDF file I can just select this file if I want to translate it on my project and then select sync to crowding after I click on sync to crowding it might take a few seconds to actually sync to my crowding account you will see like this loading animation you can also select all the files of a folder by selecting that folder and voila here we have the content on crowding select content for synchronization to Google Drive this is like a back and forth process we first select the files on Google Drive then we sync that to crowding and then once we have the translation we will sync it back to Google Drive and we will have the translated version let's see how you can do that but first let's also check out these options that we have at the top we can see error Logs with the most recent error logs for this application right now we don't have any because we just installed it here we have the settings if we want to schedule synchronization for pushing sources and translations we can push sources and translations every hour every 3 hours 6 hours 12 hours or 24 hours and we can also show shared with me files from our drive if we don't want to show files that have been shared with us on our Google Drive account then we just disable this and then we can save and close this if we ever need to log out we can do that and log back in with a different Google account with a different Gmail great so now we have this on crowding and we can see we expand the folder and the file we can see that we are going to translate it into Spanish because this is our target language if we go back to our project and we check on sources now we see a folder that says Google Drive integration demo welcome to Free code cam we see the file over here in our sources Tab and if we go to our dashboard we will see Spanish as a target language and then we will see this the file ready to be translated if again we double click on this file we will go to the translation editor where we can start translating let's translate this first string again this is how we translated it before so I'm going to select this option and save the translation and then we are going to select this translation memory string again and then we are going to save it we're just going to translate the first two strings of this file so you know how this works remember we already saw all the different details of this translation editor so you should be familiar with these details you can continue translating the file but I'm going to show you how you can synchronize this back to your Google Drive we will have the first two strings in Spanish after we have that saved we can go back by clicking on the arrow and then we see that we are getting some progress on the translation 7% awesome right but we want to synchronize that to our Google Drive we go to Integrations details and then we can sync it manually or we can set the synchronization time like we saw before in the settings to a specific number of hours if we want to do that manually we go here to synchronize it and then we synchronize it we can either choose to synchronize the entire folder the file in all the languages or synchronize a specific language let's choose Spanish here and and then when we select the file and the language we can click here on sync to Google Drive If We sync this to Google Drive let's see what happens again we may need to wait for a few seconds until this is synchronized and we see that the file was exported successfully what happens now well let's see if I go to Google Drive now I see this welcome to Free code camp with the Spanish letter code the the two letter code and I see that it is in a doc X format because remember that crowding converts the file formats when we're working with PDF into a format that is easier to edit and work with with individual strings so if we double click on it we will be able to open it in Google Docs and we see the translation we see the first string translated and we see the second string translated awesome right crowding added this language code to differentiate the files automatically so if we have multiple languages we will have different files with their corresponding language codes we can do all of this manually like we just did or remember if you go to settings you can set the synchronization schedule to an hour 3 hours 6 hours 12 hours or 24 hours if you're translating your files gradually step by step or with multiple team members you can synchronize all of those changes to Google Drive that is an example of an integration that can be very helpful in crowding we have many many different Integrations in the next section I'm going to show you some of them so you have an idea of the kinds of things that you can do with this amazing Integrations feature now that you know how to actually install and use the integration let's see how you can uninstall it if you click here on details first I would suggest logging out here where you can log out of your account by clicking on log out and then it's just the same process for logging in again with your Google Drive just like we did a few minutes ago and then if you go to add integration you can choose here to uninstall it let's uninstall it and see what happens we see are you sure you want to uninstall Google Drive application well you can uninstall it like this and we see uninstalled successfully if we refresh this page then we don't see any Integrations and again we can always install a new one there are tons of free options to choose from if you want to filter the the Integrations by a specific criteria you can do that by category features CMS marketing e-commerce development specifically this is very helpful for development if we are translating a website like we are going to do in just a few minutes we can add the GitHub integration gitlab bitbucket in addition to the Integrations and apps you will also find guides over here and others that are tagged with system come over here so there are different types of resources combined in this very helpful you can also filter by author by tag search for a specific Apple integration filter by category sort by relevance sort by name sort by date published and you can always reverse the order great so let's go into the next section where we will take a look at some of the apps and Integrations that I think would be most helpful for you if you planning to translate your files or your website if you're working on development I will see you in the next section and then we will start working with the GitHub integration and working with other Integrations to actually translate your website so I will see you in the next part first we will take a look at the Integrations that you can use so let's go there let's dive in before we dive into other specific Integrations like the GitHub integration and the the visual studio code extension I'm going to show you some of the Integrations that I personally think would be most helpful for you as an organization or as a representative of an open source project or an educational project first of all of course we find the GitHub integration over here if you click on the integration you can find more details about it like an overview and here you can find specific details like the permission it requires and how it will be registered so it is very helpful you may also find other tutorials by crowding and how to set it up specifically we will cover the GitHub integration and we will see the visual studio code extension they also have a visual studio code guide over here in the absent integration section over here a guide of how to use crowding for VSS code we will see that step by step with a sample react app then we also find other tools that you may find helpful like Google Sheets integration if you're working with Google Sheets to create your glossies or to translate content that you're storing on a Google sheet you can also install this free beta integration right now it's in beta it's in in testing in a testing phase but when you're watching this video this may be out of beta so it might be more stable you can install it by clicking here to synchronize multi-link Google spreadsheets if you're storing your files in other services like Dropbox you can also install this free integration the Dropbox integration to localize your files like we did with Google Drive and since artificial intelligence is increasingly becoming more important in every area of development and translation crowding also included an AI assistant CH GPT Gemini to take your localization to the next level right now it's a free integration it's in beta and you can install it by clicking on this button you can find more details about it and how it works here in the overview another integration that I would suggest checking out is the suggestions diff Checker this integration Compares two translations and sees the differences between them so this is an integration that's especially helpful for proof readers and for translators that compares two two translations and shows the differences between them so that can be helpful because sometimes when we are checking the translations we may miss small details and this just highlights everything better it's a free integration that you can install with this button remember that with the free plan you can only use one integration at a time so make sure to choose that carefully but they are all really nice we also have a glosser editor we can add and change the terms from your glossies directly from the crowding editor if we in install this integration it's also free we can install it like this we can just edit the terms directly from the crowding editor without having to go to the glossery tab that can be helpful to save your time and if you're an organization that's also sharing educational or free content through video resources you may find these two Integrations super helpful you just write here captions and you will see this extension video captions Translator translate captions titles and descriptions from YouTube videos video captions localization with crowding you have the tutorial over here and you can learn how to set it up but it's always very easy they're usually very similar to what we just did with Google Drive they just have different purposes and that's also very helpful to synchronize the files automatically and I would personally suggest if you're working with video using this integration video preview this is an integration that lets you preview the video that you're translating when when you're translating the subtitles for additional context this is always very helpful if you watch the video when you're actually translating the subtitles or the or the captions so these are some of my personal suggestions for apps and Integrations I had an overview of the Integrations and these are the three ones that I do think would be worth it for any type of project specifically the last two if you're working with video but there are hundreds to choose from and many of them are free so take advantage of that you can use the one integration with the free plan if you're working on mobile development you also have Android Studio A plugin for Android studio and many more congratulations on reaching this part of the course it's great to have you here and now we're going to dive into the crowding Enterprise features why crowding Enterprise well because that's the plan that open-source projects and educational projects get for free with crowding first let's start with the basics let's start with how you can actually get a free license from crowding if you are an open- source project an educational project let's see if you go to crowding docomo here to pricing and you quickly scroll down to the bottom and you reach the frequently asked questions you can see here at the the bottom do you have plans for open- Source projects and educational institutions yes they do have them so if you want to use crowding for an open source project you can sign up for a free account set up your project and then send them a request they will grant you the license you can also apply for an academic license if your project has educational purposes each granted license will include an unlimited number of projects strings and members here you have the links for requesting that license after you set up your project and you follow all the steps that we saw in the previous part of the course for that you will need to choose either open source or academic license for either one of them you can open them and here you will see if you are an open source project the setup request form crowding is completely free of charge for open- Source projects before submitting this form and where you will request the license you will need to ensure that your project meets the following criteria here you have the list this may change as this may be different when you're watching this course but initially you have to create a translation project in crowding the project that you are currently owning the open- source project has to be licensed under an approved license from an open source initiative your Project's source code has to be publicly available for download you do not have any commercial products related to the open source project that you are requesting a license for you are the Project Lead so remember this you have to be the project lead to actually request this license and submit the form you have been working on your open source project for at least 3 months you must have an active community of collaborators you keep the news section of your website up to date and you release updated Builds on a regular basis so it's not like a project that you just released once and then you don't update anymore it has to be updated on a regular basis please note that as an open- source project maintainer by submitting the form you are agreeing to join the crowding beta group so you will test the latest features and you will also contribute your project translations to the crowding Global translation memory to gain access to crowding neural machine translator this is the form that you have to submit the project name project license project website URL describe your project in as much detail as possible your email your name your crowding username and your crowding organization name specifically for crowding Enterprise if you're currently on a trial all your information is kept secure and protected so after that you just submit your request and the crowding team will contact you that is for an open source project but what about academic projects you just go here to the second form and you will see a form that is very similar with some differences this is an academic license project setup request form they are intended for educational purposes only they can only be registered with the educational email address of your institution they must match a school's domain name here you can see the different features you can have open or private open licenses are provided for Public Access projects and private licenses allow you to limit project access due to confidentiality so you can choose between an open license or a private license and here you can see the differences in the features the most important one is that here you have private projects if you choose private the open license does not have private projects open licenses are completely free of charge here you can see the form the name of your educational institution your project name project type it can either be open or private describe your project in as much detail as possible your email your name and your crowding username then you submit your request with this form this is how you can get a license if you're representing if you're the Project Lead of an open source project or an educational institution awesome so after you have your license let's see how you can actually create an organization in crowding with crowding Enterprise this is more advanced and the crowding domcom account that we have been working with it has more features and it's usually used for large organizations or teams that will be working with many team members or using the power of crowdsourcing by engaging collaborators to create an organization you just need to go to here login or sign up if you click here on sign up you will go to where you can actually sign up for an account but by default crowding dcom will be selected this is like the basic account that we have been working with so far when you get a license as an organization you will be able to create a an organization through crowding Enterprise that has more advanced features and you can also try it for free for 30 days to see if the features match what your organization needs to sign up to create the organization we see this short form the organization name you will need to choose an organization name that will end with doing.com in our case we have an organization called freec codam course demo. crowding if you go to that URL you will be able to check your organization then you need to enter your work email that's usually an email granted by the organization or the project then your username and your password after that okay check this check box to agree to the terms and conditions and the privacy policy you will also see a verification from cloudflare and if you click here you can create an organization I already have my organization created so I will click here on enter an existing organization to enter an existing organization you just need to enter your organization's URL in my case that would be freec codom course demo. crowding dcom it's very important to write the name with dashes okay if you forgot the URL if you click here you can find your organization with your email they will send you a confirmation email and find existing organizations you've joined or can join but for now since we are just logging in we are going to enter our organization's URL then you will see this the name of your organization then here you will enter the email or username that you used when you created that organization and then your password if you don't want to use your password and that's usually what I do I can click here on the magic link option it's super helpful it will send you a link to your email and you may also need to enter a second verification code but it's helpful because you don't have to actually remember the password you can either click here on login if you enter the password or click here on Magic link I'm going to show you magic link because it's very helpful and I love this picture just see your email here confirm that it's your email the one that you entered before you can also choose if you want to stay logged in then send magic link you will get a magic link on your email and you will be able to click on a login link that will open crowding on a different different tub and this is what you will see when you enter your organization account it's very very similar to the crowding decom account but it does have a few more advanced features when you get the full license as an organization but we will go through that and you will see the similarities and differences in just a moment over here the first thing that you can see is the sidebar it's located to the left the first section is the workspace where you will see your projects or groups groups are like folders that you can use to categorize all the different projects of your organization a project is the set of files that you're going to translate for a specific project of your organization but a group is a way to group your projects we will create a project and a group in just a moment for now let's just have a quick tour of these options because you will find them very familiar if you already watch the previous part of the course then after workspace we find start projects if you have many different projects and you want to just select your favorite ones or your most used ones or the ones you're actively working on then you can click on the start icon in the project start them and find them all here that's very helpful if you have many projects then here you can find notifications you will see a history of all the notifications as like in a timeline and you can mark them as red red or un red you can also find archived notifications and you can filter them you can show all notifications just unresolved issues or notifications without a reply here you can also Mark all your notifications as red but I already did that here so that's why this is gray out but you should have this enabled if you have unread notifications then after that we find the messages messages is where you can create conversations remember conversations from crowding decom yes it's basically the same with crowding Enterprise you can start a conversation with individuals or invite multiple members you can search for members by their name username or email so here you can enter a username and an email and you will find your member and start a new conversation here we also find tasks tasks here work a little bit different because in the general view of this organization tasks are like shown globally you can create tasks within specific projects and they will all appear here you can also assign specific people to each workflow step and enable project notifications to avoid creating tasks but that is something very specific it's outside of the scope of this course you may dive into this if you don't want to create tasks for specific team members remember we create the task directly within the projects and they will all appear here because we're not actually with in a specific project we're within the organization's account that's something that you should keep in mind when you're in this main dashboard great that's the first category of tools and then we find more advanced tools that we have seen in the previous hours of the course here we find managers I created the organization so I am the owner I am a manager here it shows when I joined and the teams I belong to I can also search for specific managers here if I have many different managers in my organization and I can go to different pages and choose how many rows I want to see per page that's great I can add Managers from here you will see this helpful description on the bottom right and you can either click on got it learn more or actually use that additional tool here we can add a manager and adding a manager is very similar to what we did in crowding dcom you just need to enter the name username or email here and you will be adding a manager then you click on done and that's it you will be adding a manager for a specific subgroup or project then we find workflow templates we have not really covered workflows during the course because this is something that is more oriented towards Enterprise accounts and organizational accounts they're basically a sequence of steps that um the content of your project should go through when you start your project like like translation proof reading and quality assurance all the different steps that you would follow in a translation process here you can find some workflow templates that you can start with that you can edit and customize to your needs if you need to search for a specific workflow you can always search it over here and you can sort them by their name or by the date that we modified you can also reverse the order over here and change this to list view if you don't like the grid view I personally like the grid view because it's more Visual and I can actually see the workflow here they do have some similarities with flowcharts because they describe a process and a sequence of steps if we click here on let's say crowdsourcing because that is an example of what a nonprofit organization like an open source project would usually use crowd sourcing remember is the practice of engaging your community in the translation process so if we click on it we will enter like the the workflow editor and we will be able to customize each step let's have a quick overview of this so you can understand this better this is the workflow you can if if you click on the left Mouse button you drag it you can also zoom in and zoom out with these controls here at the bottom left and you can click on each individual node over here in the workflow to learn more about how it's being configured for example how can we read this workflow we start here we start the process and then we see that the strings are on translated then they go through a process of translation memory pre- transation here we see that we need to select the target language so it does need some specific setup or configuration to start the process Auto substitution of 100% match for the translation memory so the automated suggestions have to be a 100% match to actually translate it then the strings that are unrated go to the crowdsourcing phase here we can see more details about this phase engage your community in the localization process collaborate with volunteer translators and reward their efforts in a way that works for both of you all projects with this workflow step will be publicly accessible and translation resources will be shared with all volunteers registered in your organization ation so you can see that we have some description of these steps and Below them we have some settings that we can configure but for that we need to edit the workflow and we will do that in just a moment finally here we see proof reading and once the strings are approved because everything is translated you can see here we have translated strings then we just need to approve it then the strings are approved and the process ends since we don't have any Target languages yes we need to select a target language this is the basic crowd sourcing workflow we have other templates let's see how you can edit the workflow on the left side barar when we edit the workflow we see many different steps that we can add to this diagram and we just need to drag and drop them like this let's say that I want to add an extra Pro reading I can just drag it onto this area and I need to connect it with the previous node in the process so let's say that I want to have a second prove reading phase I am very very careful with my translations and I want the team to have a second proof reading phase what do I do well I just disconnect these two notes and then I take this node I click here at the bottom you will see a plus sign and I connect it over here creating this flow once the strings have been approved I just take this at the bottom and voila I connected with the end like this and I can readjust the location of the noes or the the different steps in the process over here in the diagram and I can also configure it so let's say that the output of this pH will be an approved string so that is already marked by default because it's a proof reading note and the output could also be approved by the assigned user and that would change the output of that node we can select specific languages for the output of that node or what the that phas will involve Great that is a proof reading step but we have many different types of steps we have Source text review custom code switch Source language translation memory pre- transation machine translation pre- transation translation translation by a vendor translation by apis proof reading and prove reading by vendor those are all the steps that we have right now and since we're already using the crowdsourcing step we see that it is great out because only one crowdsourcing step can be added to a workflow so they do have some limitations based on the logic of the step let's see how for example we can configure this translation memory pre- transation we can select the language we can turn on or off the auto substitution or we can use project settings and we can also set the minimum match ratio how good should the match be for the translation memory to actually assign a translation to the string in this case we're saying that it has to be a 100% match but we could decrement this number so we can actually find a match that fits our needs or we can also ask the match to be perfect to actually translate the string before the crowd sourcing step and in this case I would suggest keeping this off but you can automatically approve added translations you can choose to approve the added translations if they are a perfect match you can approve all of them which is it's always recommended to actually have someone reviewing that translation before it goes live in your project because it is automatically generated or it is selected from a database of previous translations that may not be appropriate for specific context so it's always great to have a pro reading phase before approving them but with perfect match with perfect match but approved previously or you can also replace all but skip Autos substituted translations so these are the settings that you can customize after you have your workflow ready you can choose to save it you can also undo or redo the changes you can find more information here in this question mark and if we see the tips we see drag workflow steps to the working area to get started that's exactly what we did right now we can drag the workflow steps we can set the connection between all the selected steps we can select the target languages and configure step settings to make each step work you need to set it up click on the steps one by one to Define Target languages and other specific settings workflow configuration is almost done so you can click save if all the steps are correct and if all the steps are connected to each each other like this and over here in the gear icon you can see the workflow settings you can change the name of the workflow you can change the description the template already has a description that you can customize and you can also choose don't center the selected workflow step when editing you can enable or disable this and after that you can save your workflow by clicking here that's basically the workflow editor and you can customize this to fit the needs of your organization here if we go back to the workflow templates in our organization we go back and we can see additional options over here in the templates if we click here on the information button we will see the name of the workflow and the description so we can see more about the workflow before we actually enter the workflow editor and if we click on the ellipses we can preview the template if we preview the template we see it over here and then we can click on edit we can also go back we can edit it directly we can duplicate it and we can delete it if you want to customize a template but you don't actually want to change the template itself then you can duplicate it and then customize it to your liking and you can also delete it another option would be to create a new workflow from scratch if you want to do that then you just need to click here on Create and then you can create a new workflow template projects within an organization can share the same workflow template or have different ones each step can be assigned to different people and include different languages so we are creating a new workflow template because over here all the workflows that we have are templates that we can assign to multiple projects so we can create our workflow once and reuse it as many times as we need to we are writing the name of the workflow and the description once we have that we just click on Create and that will create our workflow we can assign it to the projects we need awesome now you know how to work with workflows so let's continue with these options you will find them very familiar because they are familiar we saw them previously the translation memories we don't have any yet because we haven't created a project but here you will find your translation memories your glossies and your machine translation the translation memories can be created over here with a create button and if you create a new translation memory you will need to enter the name the language and you can drag files here or you can select files from your file system if you want to actually upload a file with the source strings and their translations into different languages this can help you to speed up the translation like we did in crowding dcom the glossaries can also be created here with the create button new you you just write a new name you assign a name you select the language of the glossery and you can also drag glossery files over here machine translation has a few different options by default here you can see crowding translate the engine is crowding translate and it supports 24 language pairs you can see them over here English to all of these languages French to English and Chinese simplified to English and Japanese so you can check if the language pair that you're looking for is available here on crowding translate for the machine translation process if you click on this ellipses you can edit the machine translation clear cache or delete and you can change the view by clicking here on select columns if you want to show all of these columns just check them if you want to hide any of them just uncheck them and you can customize the user interface to fit your needs this way you can also hide everything or show everything over here with all selected great and you can also over here we go to the bottom right you can add a machine translation engine you will see it added over here below as a second entry here to add a machine translation engine you can use an existing integration or a custom integration and here you can select the engine Google translate Microsoft translator Amazon translate then you assign a name to your translation engine and you select the applicable languages you can leave it empty for access to all languages and you can enable the machine translation in specific projects here you would be able to select your project you can leave it empty to enable it in all the projects after you have all of this set up or if you want to set up a custom integration you can do that and then click on Create and you will have your new machine transation engine that's for machine translation if you want to go to reports then you click here on reports and you will see basically all the information that we had in crowd.com in a different view or presentation the organization overview number of words languages the percentage of strings that have been translated by users translation memory machine translation we have unresolved issues quality assurance issues we have charts different charts and graphs of the proof reading and translation activity so you can have a a bird side view a general overview of everything that is happening in your project and you can keep a close track on your theme it can be super helpful remember that you can change this to show you for example a number of words number of strings characters or characters with spaces so you can get as granular as you need for your organization and you can also expand the range the the time range of the summary from 30 days to 24 hours to last year or you can narrow it down to the last week depending on the data that you actually need to analyze they're very very helpful and in this with this option the purple option you can also generate a list of translators based on a specific period of time to see who contributed the most to your Project's translation if you click here on generate you will get a list of your Top members that's always helpful to know who has contributed the most to your project after that we find here the store which is an interesting area of the organization because it's already incorporated into the organization if we click here we will see all the different applications that are available in crowding if you see this little arrow here that means that the extension is free to download or free to incorporate into your projects and they do have many many different applications in their store you can filter them by author by specific authors you can filter them by tax those are the two options author and tax you can also search for them in the search bar you can filter by categories and by relevance by name by date publish so basically you have many different options to find exactly what you need and additionally you can also reverse the order over here we also find something very interesting if you want extra quality assurance checks you can go here to QA check templates and you can add them to your project like colors mismatch date format consistency find duplicate words Emoji mismatch extra phone number forbidden characters it's just great to know that we have all of these extra quality assurance features that make the translation process a lot easier so I recommend checking this if you are representing an organization it will help you and your contributors a lot it will save you a lot of time and finally we reach user management user management is where you can manage users and teams I can see a summary of all my users when I joined when I last saw the project my name username the permissions I have and I can select my row and perform other operations on me like on that user which is really me but it could be any user that belongs to my organization I can edit the user first name last name pronouns time zone and the email and I can also view the user crowding is currently working on a feature that is coming soon working on so you can expect this feature to be available perhaps when you're watching this video it seems like it will show you the test that the user is currently working on so that's great I'm looking forward to that feature from the bottom right you can also invite users if you want to invite people to your organization you can use their emails you can send multiple emails just separate the addresses with commas so if you write the emails here like sample gmail.com and demog gmail.com you will going see that I'm adding all these emails and I can also remove them here by clicking on the X if I click here on this button send invite I will be sending the invites to those emails and they will be able to join my organization now that we covered all the tools that we have here on the left sidebar let's go to the settings because in crowding Enterprise we also have settings that we can customize just like in crowding dcom we will go through them real quick first we're going to start with the account settings and then the organization settings for the account settings we can see our personal information like Photo first name last name pronouns the platform language we can change this to English or Chinese simplified our username and our email then we have security features like the authenticator app connected applications device verification they have many different ways to keep your projects safe then we have notifications we can configure if we want to get inapp notifications or email notifications or custom notifications basically we can get notifications for many different things like collaboration Integrations new strings language progress content issues it's really great to know that we can customize this to fit our needs exactly I encourage you to go through all of them and check what you would like to enable or disable from the notifications panel and over here we can also find personal access tokens that we may use with accounting API command line interface and some of the Integrations and plugins they may ask for personal access tokens you can generate a new token over here clicking on this button and that's the account settings in Enterprise if we go to organization settings over here we find even more settings that we can customize we have the name of the organization we can change that the logo public organizations this section is unlocked when the organization has at least one public project a public project in crowding is a project that has has a crowdsourcing step in its workflow remember we just talked about workflows and we had a crowdsourcing step so we have to have that step to enable these settings public description default public project View and featured projects free Cod cam is an example of a public organization you can see this over here we have this view we have different projects and we also have the name and we can have a description here in about and finally we see a custom domain you can enter the custom domain over here and save it then we see authentication we see different apps that we can install from the store and we can also install private apps custom QA checks what we just saw that we can add from the store we can configure web hooks custom languages custom placeholders and much more like security logs and legal and compliance but that's beyond the scope of what we're trying to do over here those are all the settings that we can configure if we go back to the workspace now let's go through these options that we have here we have the search bar where we can search for projects if we have many different projects they will appear here and you will be able to filter them to find them quickly here we can see notifications over here we can go to conversations it's the same as clicking here and here we can find more information like support help center community cookies keyboard shortcuts and what's new you may see some differences between what I am showing you right now and the state of crowding Enterprise when you take the course but they will be small updates or additions or modifications but overall the functionality should be basically the same great now you know the basics of the crowding Enterprise user interface so we're going to create a project in in in crowding Enterprise to show you how it works and how we can also create groups to group your projects by category so I will see you in in the next section to continue with this topic let's say that I I'm representing an organization and I'm creating the project in my organization's account how can I do that how can I start a new project we're going to be looking at how this works with a basic example the PDF file that we worked within the previous sections of the course but this process will apply to projects of any complexity okay I'm just using the PDF file to show you all the basics if we click here on create on this button here at the bottom right we will see two options we can either create a project or create a group what's the difference between a project and a group a project is a set of files that we are used to working with but a group is like one level above the concept of a project because it's like a folder that organizes related projects on under the same area or space in the workspace if we create a group we can also create subgroups groups within groups of projects and that's very helpful to organize our projects because they can share resources within the same group we can share translation memories we can share glossaries we can share Machine translation engines and workflows so creating groups and organizing your projects like this can save you your contrib rors and your team a lot of time so let's create a group let me show you how we can create a group new group let's name this Android let's say that we are an organization and we are developing an Android app like free codam has its own Android app if we are planning to have multiple projects for Android then we can create a group named Android and then we click here on create group if we create that group we can see it right here Android the group is empty but now we see the workspace we can filter our groups and projects by their visibility by public and private projects by their translation status and by the workflow status we can also filter by their name and sort them by their name by when they were added by their last activity and we can switch between list and grid view but I personally prefer the GD view so I recommend it but it's really up to you if we click here on the group we will be inside the group inside the Android group we can see it here within our workspace and currently we have no projects in this group all projects that we add to the group will appear over here just to show you how this works with multiple groups let's create another group let's say web for all our web application projects create group web and let's create another group iOS let's say that we are developing an app an app for Android and for iOS and we also have a web version like fre codam so we have three groups here that are all empty right now if we go into the groups we will see them over here we see the overall workspace structure and if we click here we can go from one group to another without actually returning to the main workspace this is quicker and it can save you a lot of time awesome so you know what a group is you know how to create it so let's actually create a project let's create a project in crowding Enterprise for your organization to create a project you click here on Create and then you can choose if you want to create a project or a group a group is like a set of projects here we created the groups Android web and iOS right now these groups are empty but we can always add new projects to them let's select project here and let's see what we need to choose and customize we need to customize the name so let's name this freeo cam tutorial the project languages are going to be Source language English and target language again we see the same list of languages that we are familiar with from previous steps and we can choose Spanish let's say that we are going to choose Japanese Bengali Hindi and French just to add a a few Target languages for our project but we will be mainly working with Spanish like always we can always click here on the X if we want to remove that language selected from the list then we can also click on clear we can create custom languages or we can prefill the list with the top 30 languages on crowding we have all of these options then optionally we can choose a workflow by default you will see the in-house translators workflow but but you can remove this with the X and you will be able to set up a workflow later you don't have to do that at this particular step and you can see all the four templates that you already have predefined let's say that we choose a crowdsourcing workflow just as a example because if you're representing an open source project or a nonprofit organization you will be working with crowdsourcing so let's see how this works we can also enable this delay workflow start delayed workflow start allows you to upload existing translations and resources like translation memory or glossies even before the project becomes available for translation so if you want to upload any existing resources to your project just enable this okay for now we're going to keep this disabled and then we create our project and here we can see our project in crowding Enterprise it's a bit different than what we saw in crowd.com but the functionality is essentially very similar let's go through the main aspects of this first here we find the name of our project and we can search for projects if our organization has multiple projects we can also star our project if this is a project that will be used very frequently we can start it here by clicking on the start and you will see it in the start projects in your organization that's helpful if you want to keep track of the projects that you're currently working work on or your most popular projects so that's like a quick way to have them at hand here you can see that we have the crowdsourcing workflow five Target languages zero Source words because we haven't uploaded any resources yet and the last activity was a few seconds ago we can change our project's logo in the settings that's always helpful to create a friendlier tone for the organization and for your volunteers and contributors first here we we find the dashboard in the dashboard we find our Target languages with a very similar user interface that we had before we have the translation and approval percentages we can see a more detailed breakdown of the different steps of our crowdsourcing workflow that we chose we see this automatic step we have the crowd sourcing step and we have the proof reading step and we can go to the editor very quickly or we can close this for every individual language if we click on the language we go to that particular language and here we would see the source files if we go to the details we can see all the managers and if we have any members project members we will also see them here we see their role the project ID when it was created The Source language we can change that by clicking on the gear icon and then choosing the language again we can change that over here if we need to and we see how many project members we have we also have the option to upload download or pre- translate right now our workflow in the second tab here in the second step we see the workflow scheme here we can see that we have the same workflow that we had for crowdsourcing before but now instead of being a template it's actually customized to our project because now we do have Target languages selected Bengali French Hindi Japanese and Spanish so instead of being just a template now we do have specific translated languages and here if we click on crowdsourcing we also see a special page this is your crowdsourcing settings page here you can configure the appearance of your project on the public page what your volunteers will see set up branding and build a community by sharing an invitation link on your website or social media that's basically what fream does for our community once confirmed publish your project to make it visible on your organization's public page if we go to free code camp we can see that this is the translation page for our Organization for free code cam we see the feature projects all the projects we see an about page and we can also share links to our organization on our website so basically this is what free Cen has configured we can customize our logo by uploading a new logo here change the public project name use a catchy title to inspire your contributors then we see the public project identifier the public project URL how people are going to be able to reach your public project and your description this is optional you can also choose a custom domain if you click here you will go to this part of the settings where you can set up your custom domain your organization settings now if we go back to the project now we know what workflow is we know the crowdsourcing step in the crowdsourcing step we also see the readme we can edit the readme with the markdown format add links quotes and images everything to get your community excited about this new project that they can contribute to you can also activate gamification but that feature is coming soon it seems like it's going to be a great feature you can activate reward system to encourage contributors that's a very interesting feature I'm looking forward to seeing it might be enabled by the time you watching this video so make sure to try that for encouraging your community then you can also see the status image this is something that you can embed in your projects read me the localization status this one right here the general documentation or any other service for that you use for the project like GitHub this is a preview of your status image it will show the percentage of the translation of your project you can embed that status icon with this line of a markdown here for HTML this line of markdown for a your readme or markdown file and you can also share this image URL you can copy it by clicking on this button and it will be copied to your clipboard you can also invite a developer if you need help with any of these steps another thing that is very helpful for crowdsourcing is assigning proof readers and manager roles proof readers and managers participate in discussions they help you find the best translations and basically organize the localization community so you can invite people here and you will be inviting them to contribute to this particular project and finally we see building Community direct link this is a link that you can use to invite people to your crowdsourcing project you can share it directly on your website or send it via email it's great out but you can copy it here and it will be copied to your clipboard please read the privacy policy notice so you know everything that crowding is sharing with you here about the privacy policy when you share this link and here we can also see a website pop up you can see the crowding is thinking about everything that can be helpful to engage the community for these types of crowdsourcing projects you can also add the website popup the crowding web widget encourage visitors to your website to contribute to the translations the this widget allows browsing visitors to translate and vote for Strings shown in a Rand order directly on your website this way more people can contribute to your Project's translation you can enable translations via the web widget over here if you click on it and you can add this this JavaScript snippet to your website Pages where the widget should be displayed you just copy it right before the closing body tag and you will see the widget where people can contribute please note that each person who clicks on the widget must choose from the list of all the project Target languages be for contributing if you want to skip the step predefine the target language at the beginning by adding the language code to the snippet members will also be able to change the language in the widget settings this is an example of what a snippet with a French predefined language would look like here we can see this data language code we can see F FR which is the twetter code for the French language so that's very interesting and I highly suggest diving into these Ops because they can be super helpful for engaging your community especially this feature that is coming soon the gamification system to reward your contributors great so after we know about that let's go to sources here we find files and strings files is where you can upload your files it's very similar to what we saw in crow.com but we have a few option a few different options here we see upload files from the device from your device you can also upload zip archives you can use samples from crowding to explore how the platform works you can set up Integrations with your repository or other supported systems like we did before and you can invite developers to help you with the project setup currently we have no files to translate but I'm going to upload our welcome to Free code cam sample file just as a test upload file welcome to Free code cam it's uploading the file it's uploading the file and you may need to wait for a few seconds while it's being uploaded and also remember that this has to be converted into individual strings so it might take a few minutes or a few seconds while it's being processed also since it's a PDF file it will be converted into either HTML or dogx files it's automatically converted so now we close it and if we double click on it we see a preview of the file over here if we click on these three small while the in the ellipses we see all of these options preview opening editor settings download Source view progress view strings update move rename and delete basically the Bas the essential functionality that you would need for any file and I'm showing you this with a basic doca or a PDF file because the functionality will be exactly the same for projects of any size or complexity okay so I'm focusing here on the basics to be as general as possible so you can understand how this works and apply it to any project that you're working with let's select this file and let's see what we get here on the right sidebar we see the details the number of strings number of words when it was last updated we can preserve folder hierarchy for export that is also important if we want to keep that hierarchy when we export the files we can click here we can also download the translations for selected languages and we have a history of revisions made to the file we have 24 strings added none of them were updated and none of them were removed at this point then you will see like a timeline a vertical timeline being created as you work on the file great revisions one and you will be taken to that timeline you will see all the different revisions of your file with this Arrow you can also set the priority right now it says medium priority if we click on it again it will turn red and it will have a high high priority or right now if we click on it again it will go to a low priority so you can help your translators choose what to translate first by giving them this particular priority great over here we also find the search bar we find an option where we can create a branch if we're working with Version Control Systems like GID and we want to create different branches we can also create folders and we can add new files we can upload them we can create strings Vault or we can set up an integration to upload them or import them automatically through an integration now if we go to Strings now we can see all the strings that we had from that particular file that we just uploaded we can see the key for that string the context and the source in English the text on the string so we have all this detail and for each individual string we can edit it we can hide it or we can assign a label to it we can manage labels if we click over here and assign labels to individual strings it goes to a very granular level this tool and how crowding presents the information we can filter strings because you can see that right now I only have one very simple file and I already have all of these strings for a real project this would have like thousands of rows or millions of rows potentially if you want to filter them you can filter them by strings with issues with comments with screen screenshots or with different visibility only the strings that are hidden or visible you can also search for them by the source string by the context or by anything you need to filter in this list you can edit the string that you currently have selected by selecting that string with the check mark over here and then clicking here on edit that's another way of editing that string you can also hide it or you can manage that String's labels these are like shortcuts to the options that you have over here we can also add a string add a source string ourselves if we need to if it's a string that is not in one of our source files here at the top we also see all files we can filter the strings by the files that we want to check for example if we had multiple files we could only show the strings for this particular file and here we can search for that file if we have hundreds of f files so we don't see all the strings here in an endless list of rows we can just go to the strings that we're interested in and over here we have an option called labels where we can manage the labels that we can assign to specific strings we create a label and then we can assign it to a string very easily with this option label ass let me show you how to create a label we go to labels then let's say that this we want to create a label that says that the string is important let's say we save it now we have that label we can edit it or delete it and now if we go back to sources strings and we select a specific string we are going to label it as important we mark it we check it and then we apply it like this and now that's string will be marked as important for that label it's a great feature if you want to categorize your strings great so after that we go to the next category translations where we can upload existing translations if we have them download them as zip it's very similar to what we saw in crown.com this one is really very similar you can download all languages or specific languages this will be languages from your target languages for that particular Pro project Target file bundles that you can generate and you can have over thee a Content delivery but this is beyond the scope of the course this is more advanced if you want you can dive into this option you also have an option to preview translations as a CSP file and xlsx file or you can also preview them in the browser if you click on preview in the browser you will see like an overview of all the strings that you currently have and since we haven't translated them them they are just a repetition of what we had in English but when we translate them we will see them there then we find a screenshots that you can add and upload for additional context you just click here on upload you select your screenshot and then you can add that to your strings you can also create tasks for this particular project and it's important to remember that you are creating the tasks for that particular project when you go back to your crowding dashboard your organizations dashboard by clicking here on the crowding icon you will go back to your workspace this workspace has all the projects of your organization and if you go here to tasks this will show all the tasks of all the different projects in your organization it's like a combination of everything that you're working on all the tasks will be there but this is different from the tasks of an individual project when you're inside the project view this tasks will be the task for that particular project these tasks are for the project and the other tasks are in general for the organization so you will see all the tasks of all the projects in your workspace great so let's create a new task you can see that it's very similar to what we did in crowding dcom translate by your own translators by proof readers Source language the strings if you want to translate all the to-do strings or the strings that were modified IED in a specific time range you can filter them by labels for example if we have the important label here we can choose to translate all the important strings in that file or you can also exclude labels you can add a due date and selected from the calendar and this option is also very important to make sure that your team is working productively skip strings already included in other tasks if you select this you will be skipping the strings that have already been assigned to other team members so you will be avoiding any repetitive work then you can select the files that you want to assign the target languages like Spanish Japanese and then who is going to be assigned to that particular language I'm going to assign users for Spanish then I can select the user here and click on done I also have the option to split files and tell that user or that contributor how many words will be translated approximately so we are going to just disable this we're not going to split the file for now we're we're going to click on done then we see summary here and description here you can write a more detailed description of the task I'm going to assign myself to Spanish and Japanese so you can see that the same contributor can be assigned to multiple languages let's check this let's also add a we're not going to have any due dates for now we're just going to create the task and we're going to create it you can see that after you create your first task you will have like a the dashboard that we had before in crowding dcom where you can drag and drop your tasks and you will have one task per language here we have Japanese and here we have Spanish when the tasks are pending when they are not completed they will be in the to-do column then in progress and then they will be done you can also close the task it's basically essentially the same with a different presentation here very helpful to keep track of everything you have who created the task when it was created the current status you can open the task in the editor the percentage of completion of that task and who is assigned to that task you can also add comments here and start a discussion you can filter tasks as well with different criteria you can search for specific tasks Group by language and this is very very nice you can group tasks by language instead of seeing them like this in a board all of them combined you can group them by language so if you're looking for a task in Spanish just open this and you will see all the tasks that you currently have for Spanish and you can just reorder them and the effect will also be reflected if you change the view to the dashboard again like this it's very very helpful you can also see all the tasks for that particular project here in all tasks and you can choose to move to a different status to edit the task close it or delete it now we go to members and this is basically the same that we have been working with the member tab we have the members we know their their roles Here I Am the owner H when we gave them access if they belong to a team and here we can find more details about the user how many strings were translated approved voted or commented we can also remove members over here in the trash can and we can invite people if you want to invite people to that project this is similar and yet a bit different from what we did in crowding decom you can enter the users email username or team name you just need to write the email so let's say sample at gmail.com but don't worry I'm not going to send the invitation there and there I can assign the role manager develop ER Pro reader or language coordinator I can also just send the invitation without enabling any of these roles if I just want the contributor to be a translator but I can enable this if I want to okay manager developer if you want to give access to that contributor to the project as a proof reader you can enable this and if you click on this Arrow where you see all languages you can restrict the access because sometimes we don't want to assign a proof reader to all the languages we want to assign it to a particular language that we know he or she is proficient in right so we will disable this access to all the project languages and then we can select a specific language like Spanish and after we select that language we can select multiple languages like let's say Spanish and Japanese we can also restrict in the access of that particular proof Feer to the steps of our workflow if we want to assign that proof reader to all the steps in the workflow existing and a future we keep this by default but if we only want to assign that proof reader to specific steps we can do so by clicking here if we had multiple proof reading steps for example multiple faces of people checking the translations we could assign them to the first step for example or the second step and we could choose this very granularly to restrict the permissions as needed that is very helpful as well in crowding that we have the granularity in the permissions to avoid any misunderstandings or anything that could happen when you're working with a team of volunteers great so we're going to remove this proof reader access for now and you can see that with the language coordinator is exactly the same language coordinators can manage people and teams of the selected languages so they have a higher level in the hierarchy than proof readers when it comes to their permissions in the platform because proof readers can translate and proofread the content but language coordinators can also manage people and teams of their selected Languages by default you will see all languages like with proof readers but you can disable this and select a specific language let's say that I want this contributor to be a language coordinator for Bengali Japanese and Spanish I can just select these three languages and now I see that I will send an invitation for these three languages and if I instead of sending an email I want to get a sharable link I can also get a sharable link I click here and then I get the sharable link I can see that it expires in one week and I can change when it will expire if one week is too much for me then I can set it the the expiration to one day or 1 hour or if it's too little then I can set it to one month or I can set it to never expiring and just keep that invitation open as long as it needs to be if I click here on copy link I will be copying it to the H to the clipboard that's another way of sending the invitation this one will send the user an email with the invitation when you're ready and you have everything set up exactly like you want it to be you can send the invite you can invite multiple members at once you just need to add them here to the list and if you want to remove them you can just click on the X to remove them that's basically how you can invite people to your organization in crowding Enterprise when you're ready just click on invite I'm going to click here on Escape so we can go back to the project and again here we have our famous Integrations remember in crowding decom that we use the Google Drive integration well this works exactly the same in crowding Enterprise but here if you have the license for an open- source project and it educational project you will be able to add multiple Integrations that's basically the difference if you click here on add apps you will see the same basically the same view that we had before with all the applications from the crowding store there are hundreds stitches from and with a crowding Enterprise plan you can choose and install multiple Integrations at once here we also find reports because if you're going to manage an organization you will also need to view the reports and this reports H tab or this reports feature is different from the reports feature that we had here in the main workspace here remember that we also had reports in our main workspace this report is for the organization for the organization remember that we can have multiple projects per organization if we need to see a high level overview of the performance of our organization we can go here to the reports in our main workspace but if we need to check specific statistics about our project we go here to the reports tab or the report section of our project it's basically the same but the data will be specific for our project we can see the overview the the project size and we also get the Top members feature where we can have an export a report of our Top members which is always helpful to encourage your top contributors finally we can also see the activity here this is like a timeline of the changes or updates made to the project we see tools over here tools that you can work with like the crowding API the command line interface crowding and context and other helpful tools and here at the very bottom we find the settings you can customize a ton of settings there are many to choose from and customize like customizing the the Project logo project name you can also transfer ownership if you need to and you can delete your project but be very certain that you want to do this because it deleting the project at least cannot be undone you can also change the Privacy this is something very important this feature over here this is something that I really wanted to highlight because if you're planning to manage contributors and volunteers this will be helpful for you task based Access Control this means that your project member can work with tasks they are assigned to even if they do not have full access to the language basically what this does is that it allows you to create tasks and assign contributors to specific tasks without giving them access or full access to the language so they can work on the specific files they are working on they are assigned to but not on files they are not assigned to if you enable this that will limit contributors access to the overall project if you're translating for example articles for from your blog or you're translating specific parts of your website or your platform and you want to be able to assign contributors to specific files then you should enable this and create tasks and assign them to tasks this is something that we are adding to our workflow at free code camp and over here we see notifications you can enable notifications for translators when there are new strings to be trans ated you can notify project managers and developers about new strings and you can notify project managers and developers when a language has been completed when the translation or proof reading process have been completed that's always helpful you can change the source and Target languages you can also customize your quality assurance settings here you can disable but it will be enabled by default the QA checks they are always like helpful and you can change how many approvals are needed to clear the quality assurance checks one approval two approvals three four five approvals you have a maximum of five approvals in the quality assurance checks we can check for omissions translation length limit tax and basically everything we had in crowding decom as well and we can change if they errors or if they are warnings we can also set up custom quality assurance checks but we can add them in our organization settings if we want to add some custom quality assurance checks here we can also enable translation memories and customize them we can set up machine translations glossies we can customize settings for importing and exporting files I highly encourage you to go through these settings to know everything that you can customize in crowding including like the labels and this is a bit more advanced the parser configuration and finally file processor this has been a general overview of what you will find in your project when you start working on crowding Enterprise it's very similar to crowding decom but you will be working with an organization and you can manage contributors in a more efficient way you can manage your team members in a more efficient way and you will have additional tools like workflows and workflow templates and that's crowding Enterprise now let's talk about Visual Studio code and how you can use the croing extension for visual studio code to localize your web application or any application really because the extension works for basically all the types of files that are supported in crowding here we are in vial Studio code I have a folder named my app a very general name that is intentional because you can use this with any application and in inside my app folder I have the locals folder this is usually how you would structure a localization project somewhere in your project structure you would have a local folder where you would store the translations and the original strings of your project and that is what you would upload to crowding to translate in the translation management tool of your choice or the localization management tool inside local we have this folder Visual Studio code is just abbreviating this because I only have one folder inside that folder so it's like compacting it into the same line this is another folder named en n from English and this is where we will store the original strings in English inside that folder and I have a file called main. Json for this part of the of the course I'm going to assume that you are already familiar with Visual Studio code you already have it installed you already know how to create folders like this by right clicking here on the Explorer create new folder and you are familiar with the Json format if you're not familiar with this format a quick overview is that it's a lightweight format used to exchange data across the web it's very popular and it's also used for translation projects we will use it when we use the I8 Max framework when we actually translate a sample website which we will do in just a few minutes so here we're going to keep this example simple to show you how the extension works but of course you can apply everything you learn here in these next few minutes to Applications of any complexity I'm just going to show you the main functionality of the extension for our demo we're going to use the the main. Json file you can name this file whatever you want like messages or notifications and the content can be anything that it would be valid in Json format but the key thing about the Json format is that it's wrapped within curly brackets and within the curly brackets we have key value pairs the key is separated from the value with a colon and the pairs are separated from each other with a comma what you would usually do in an application is writing everything that appears in your application everything that the user can see here in Json files instead of your actual HTML files so it would be like avoiding hardcoded values you would keep everything in the Json files and you won't have one Json file per language so when the application loads or the user changes the language the correct translations will be applied and for that the keys that we have over here are essential these are the keys that we will be writing in our application to replace them with these strings in the corresponding language all the Json files that we're going to create in all the different languages will have the same keys so our application will know exactly what to look for in the corresponding language folder that's the basic principle of how we structure these localized applications we take everything out and instead we have it in the Json file and that is replaced automatically by our localization framework we will see that in just a moment in a practical example with a simple react application I'm just giving you a quick overview because that's how we're going to structure our project here for the the extension we can see the title welcome to Free code Cam and the mission is to help people learn to code for free we will be localizing these two strings and in theory they would be replaced automatically in the application right now we don't have any other files we're just focusing on the locals folder I will show you how you can upload these strings to your couting project and how you can download the translations directly within Visual Studio code with this extension to install the extension you just need to go here to the extensions option in the activity bar to the left and write crowding if you write crowding here and you click on crowding you will be able to click on this button to install it I'm installing it right now and you can also find more details here in the documentation of how to use it and how to set it up but I'm going to show you that step by step you could also go to the official GitHub repository for this extension crowding for vs code great so after we have it installed I can see now that it is installed I can go back to my Explorer and now I see this new Option this new icon here crowding let's see what we get we get three new panels in this tool we see upload we see download and we see progress yes we will be able to check the progress of the translations directly with within Visual Studio code so let's do that after you install the crowding extension you need to follow these steps because the crowding exential will add some commands that you can use from the command pallet first you need to sign in to crowding so we will open the command pallet with command shift p or control shift p on Windows notice here we have all of these new commands we have sign in select project focus on upload view Focus Fus on progress view focus on download View and create configuration so first of all we need to sign in I'm going to click on sign in and this says that the extension crowding wants to sign in using crowding so we're going to allow that do you want code to open the external website I'm going to open this and I want to continue the authorization request here I'm going to sign in again because the my sign in just expired so I'm going to sign in again I'm going to log in and then I see my authorization request for crowding dcom crowding for vs code requests additional permissions this application needs access to your projects it grants access to manage projects a user has access to so we're going to authorize the extension to do this for us and then we're asked if we want to open Visual Studio code. apppp then I click here on open it because I want to to open it and then we are going to accept allowing crowding extension to open this URI open and there we go we have the extension configured but we also need to create another configuration file and select the project that we are going to be synchronizing from our local files so first of all we need to create a project on crowding dcom I go to crowding decom I go to my main profile or dashboard and then I'm going to create a new project again I'm going to name this free code Cam vs code extension demo I'm going to name this it's going to be a very long name this but free code Cam vs code extension demo again it's going to be public because I'm on the free account so I can't create any more private projects The Source language will be English and the target language let's say that it's Spanish right now of course I can always add or modify the target languages but for now let's start with Spanish and I say create project project created successfully free goam vs code extension demo currently it's empty but now we can choose that project from vs code for our extension after we have that created on crowding oncom we go back to vs code and now we can run that command we open the command pallet again with command shift p we write crowding and then we select the project it's going to load our projects and here I have my three projects from my account I'm going to select this project free code Cam vs code extension demo crowding could not find a configuration file yes that's something that we are going to create right now and the project I can see this message it was selected successfully so now I can close These Warnings the configuration file is another thing that we have to generate first we sign in then we select the project and then we create our configuration file this will tell the crowding extension what files are our source files and where we want to store our translations so I'm going to open the command palet again yes there are a few commands and the third command that we are going to run is create configuration once the command runs the file will be automatically created crowding yml this is a configuration file we see a warning that the file source is empty in my app and that's true the source and translation Fields the keys are empty so we are going to change that in just a moment what is source and what is translation we will keep seeing that error or for the warning until we just remove this so I'm going to just add a letter here to avoid that warning great but we do need to write something meaningful there in source and translation Source will be the path to the files that we want to translate where are we storing our source strings our source language is English so where are we storing our source strings in English that would be main do Json here we have the keys and we have the corresponding strings in English so we have to write the path to this file how can we do that well we are in local then the en folder remember it's in English and then this is something very interesting that crowding supports we can use a wild card this asterisk match any file name that ends with do Json that's basically it we're not writing any specific name we're just matching any name that can be here within the E folder that's the path to our files and then for translation I'm going to do this we need to write the path to the location of our translated files but how can we customize this for every language let's say that we have multiple Target languages well crowding supports using placeholders for this so we can create a folder for Spanish with es and a folder for French with FR FR if we need to translate our files into multiple languages or for Italian that would be it or Japanese JP we can use the twetter codes with this placeholder two letters code like this the only important key aspect here the only key thing that you have to keep in mind is that you need to surround the placeholder with two percentage symbols that's what tells crowding that this is a placeholder and then we can assign the original file name with this placeholder as well so if the file name was main. Json this will also be named main. Json with this placeholder but it will be within its corresponding folder with the TW letters code if it's French it would be F FR and within F FR we would have the main. Json file with the French translations that's what's so powerful about this configuration file that you can do all of that with just one line using placeholders and this will also keep the Json extension we will see that in just a moment so now we have our configuration file we have our folder and now let's go to crowding to the tool the new tool that we just installed in the activity bar and voila here we have it we can see it in upload and download and we can also see the progress bar here like this so now we know that we signed in correctly and the configuration file was correct as well now before we do anything if we check crowding oncom we refresh the page we can see that we currently don't have any files to translate that's because we haven't actually uploaded any of our files files to do that we just need the configuration file that we just wrote and then we go here to upload and we have two options here we can refresh and we can upload all our source files this is very helpful when we are sure that we want to upload all the source files that we currently have in the path but if we don't want to do that and we want to select them individually we can just click on the Arrow next to them or we can upload the folders here we can also edit the configuration file if we click on the gear icon let's upload main. Json I'm going to click here to be more specific we see uploading file main. Json and after that if I check the the web version and I refresh this I should see yes I do see it it's here in the local folder English main. Json so I was able to to upload the file following the folder structure that I had in Visual Studio code I can then take that file and translate it to my target languages let's go from the sources tab where we are right now we're going to go to dashboard and we're going to translate the two strings into Spanish I click on Spanish then I click on this file double click on the file and then I see the two strings here that I can translate crowd is smart enough to know what parts of the Json file have to be translated it's not going to translate the keys it's going to translate the values so I'm going to translate this as BOS a free code Camp I'm going to save this and then I'm going to translate this string this would be the Spanish translation help people learn to code for free then I'm going to save this translation and you can see that the two strings are translated so now we finished translating the entire Json file if we go back to our dashboard into this Spanish section we see that the file is 100% translated so let's go back to our vs code project and now we can go to the download part we can also check the progress here in Spanish and we can see that if we refresh this sometimes you will need to refresh the progress tool to actually get the current progress you can see that previously it was Zero now it's 100 and only after I refreshed it it showed 100 so this has been 100% translated but 0% approved let's approve them just really quickly since I'm also a proof reader here I'm going to go to the string and I'm going to approve it and here I'm going to approve it too then I reach the end of the file they're all translated and approv and now if I go back to vs code and I refresh this I see that it's 100% translated and 100% approved the Spanish language so that's great and now I can download my source files in Spanish and this is the true test for the configuration file when I download these new files in Spanish they should be within their own es folder that they should it should keep the same Json file the same name but they should be translated and they should have the same keys and they should be within their own es folder so we're going to test that we can always change the configuration file if we need to but let's download them you can also resize these tools if you need to okay if we hover over the my app folder we see the option to download the project translations we see the option to download source files and we also see the option to edit the configuration that opens the this file the configuration file so we have a quick access to that file if we need it here if we click on Download Project translations let's see what happens downloading translations it might take a moment depending on your internet connection and the current state of the system but if you go next to the Explorer here it is here it is here it is here it is now we have two folders English and Es which is the twetter code for Spanish we have our folder now it's collapsed but if I expand it I see main. Json so we are keeping the same file name in the two folders and that's usually a convention that we use we keep the same file name but we keep them in different folders with their translations and then in Spanish if we open the file we see that they are keeping the same key title and Mission and we are only translating the string associated with that key these are the translations that we wrote and approved in crowding tocom in the online platform so you can see how this workflow can really save you time you just go there to crowding decom or your translators go there your team goes there your organization or the your community translates the files that you need and then you can synchronize them in Visual Studio code so it's very very helpful and it's basically automated because we are already defining our source files and our translation files and the location where we want our translations to be in this will use the standard two-letter codee for the language so if you have three or four languages you would have all of them here and you would have the main. Json file with the corresponding translations you can always repeat the process upload any new files download them and you can check the progress for every language how much it has been translated how much it has been approved awesome now you know how to work with the crowding extension for visual studio code it's really powerful again I encourage you to review this part of the course if you would like to continue working with it and install it if you haven't so far let's continue now we're going to start diving into a more realistic example of a react application it will be a simple application but we will be working with the IIT next localization framework and we will see how we can use this extension to translate the files and we will also use the GitHub integration so you can translate your repositories using crowding Integrations so let's continue congratulations on reaching this part of the course now you know the fundamentals of a localization process and you know the fundamentals of crowding for individuals and teams so now we're going to start the actual developer Focus part of the course we're going to translate a react app this very simple react app but you will learn the fundamentals of the i18 next framework for react called react IAT next we will use that frame work to create this simple app but we're going to be able to change the language like this we can go from English to Spanish and vice versa with this drop- down manual by just selecting the option we will be working with Json files and I'm going to show you how you can use the crowding extension for visual studio code to translate your Json files like we did before but now we are going to apply this to a react project so you will learn the fundamentals and of course you can apply these principles to Applications of any complexity and applications in different context like mobile development web development and other types of applications I kept this application simple on purpose intentionally because I want to focus on these fundamentals so let's begin if we go to visual studio code now we see the localized app folder this is where I'm going to create my react app with create react app you can also use V or any other tool that you can use to get the starter code for a simple react application to create that I'm going to use this terminal and I'm in my localized app folder and I'm going to run npx create react app and here instead of writing the name of the folder like my app like we have in the sample documentation I'm going to write a DOT that tells the command that I want to create the react app directly in the folder where I am currently located so I'm going to press enter and the process will start I'm going to assume here for this part of the course that you're already familiar with react we're going to make some changes to the main app component and then we're going to localize that specific component we are going to wait until all the packages are installed in case you would like to review the fundamentals of react we also have other courses on the channel I'm going to keep this app simple so the fundamentals of react should be enough if you know them this can take a while to reach the end so I'm going to speed things up a bit to start working and here we go we have our react up our starter react up with all the basic files and the folder structure if we check this with have we have all the files within the source folder we have the resources within the public folder we have our node modules the basic node modules we're going to install some to add support for the localization framework I8 next for react we also have a package.json file with all our dependencies and a readme file with the license for this um for this starter code the the project was bootstrap with create react app of course you can also use any other tool like V that's totally okay and the the principles that I'm going to show you here will still apply there so now I'm going to refresh my terminal and I'm going to start the application with mpm start and here I can see the the app that I'm getting by default with the starter code we're going to edit app.js and we're going to save that to get our new application we're going to build that step by step here we're also going to make some changes to the CSS file but we're going to do that really quickly because we want to focus on localization right so I'm going to hide my terminal for now hide it hide it for now great I'm in app.js what are the main changes that I'm going to make to this app to get the user interface that we are looking for first of all we need to change the logo we're going to use free code cams logo you can get that logo from free code Cam's official style guide I want to replace this react logo with the free C cam logo so I'm going to put it on the same path right now this logo is over here in the source folder so I'm going to put my free C cam logo here I'm going to drag and drop it I already had it in my folder in another folder in my file system so I'm going to use that I'm going to like basically swap the logo with this one I just need to change this path to FCC primary large instead of an SVG file it's a PNG G file logo over here and since I don't need this logo the react logo anymore I can just delet it it's an SVG file deleted you can keep it if you like but I'm not going to use it this is what the preview looks like it's just spinning over there so let's go to the CSS we're going to make it stop spinning by removing this last key frames from the CSS file and here in app logo we're going to assign it a height of 50 pixels and we're going to just remove all the animations for that logo like this so if we go back now we see the free cam logo in a more reasonable size you can of course customize this to your liking after that we want to edit the text so we're going to replace the link and the text we're going to replace all of this with an H1 text this will be welcome and then we are going to add four paragraph tags over here the text will be in English by default for now until we actually Implement localization then we are going to replace that with the corresponding keys but as a placeholder we're going to use the text build projects earn certifications learn to code for free build projects earn certifications that's the text that we actually have on the landing page at free code camp and then we are going to add a fourth paragraph tag this is just for demonstration purposes and it's going to say that the language is currently set to English this is going to change dynamically we're going to show this with a strong tag the strong tag is usually used for text that is more important and I think that is important because it highlights the language of the application the current language you can of course customize this I'm going to choose strong and then we will be replacing this by a variable using a hook a state hook the state will be the current language we're going to assign this ID to the paragraph language text so we can change its specific style and after that within the header tag we're still within the header we're going to add a select element this select element is going to be named language in a future iteration of this project you may want to separate this into multiple components I'm just keeping it simple so we can do all the localization here in the app component within the select element we have the option this option will have a specific value en n and this value will be essential this value is going to tell our entire application what language we have selected English then we have another option value Spanish and we're going to write all the options in English right now we could write espanol here which is Spanish in Spanish but I'm going to keep things simpler so they're all in English so everyone can understand them and then that's our select element so let's apply some Styles and then we're going to add the functionality but before we do that let me add a suspense element the suspense element is very helpful in react because it gives you a way to show something while these components or elements are being loaded in the application so it's just like a backup or a fallback in case this takes a moment to load and with translations that can happen if you are for example fetching them from an external API which crowding actually has you can fetch your translations from an API and that can take some time so if we fix the format here with command shift F or control shift f we get the code nicely formatted and you can see that suspense was already imported automatically from the react module let me just move this to the top great so after we have that let's add style because if we see the application right now it's very basic it doesn't have like any custom style but it's still there it's taking some interesting shapes let's go to app.css and here to save us some time I'm going to copy and paste so we can move faster but you can of course pause the video at any time if you would like to check these Styles and reproduce them yourself I'm also going to include them in the repository but I'm copy pasting them one by one to make sure that you can see them clearly and you can always pause to know what I'm doing or what I'm changing here here I'm going to change the background of the application to match free code cams style guide this is one of free code Cam's main colors we're going to keep all the other styles here we may not need them we may for now we're going to keep them maybe in the future we're going to remove them for now we're going to keep them and finally app link and we have this color great so that's our CSS file let me go back to control and now we can see the same style that we had in our application preview that's ready and we see the two options English and Spanish but right now this is not working because we haven't actually implemented anything in JavaScript yet in our jsx file so we're going to start doing that in just a moment let's dive in when we change this to Spanish these strings should be replaced by their corresponding Spanish translations and we will be translating them in crowding with the extension we will do that in the next part of the course so let's continue so let's start implementing the actual localization functionality because so far we've been just building this basic react up let's start with IAT next first of all how can you get IAT next because right now it's not installed it's not part of our dependencies we need to install it and add it to our package.json file we can do that with npm we just need to start a new terminal here that could be SE CSH and after that we will need to run npm install let's close the Explorer so you can see it here and mpm install I8 next that will install the I8 next framework as a dependency we will actually install three different variations of this framework I8 next we will also install react I8 next and then we will install I8 next HTTP back end this is based on nodejs and it's a way for the framework to send us the the localized versions of the files the translations as a Json in Json format through the server the local server that we will be running when the react application runs in the browser if we don't install this if we don't use this then we will not be able to preview those translations you can always choose a different back end and IAT next also has a documentation of the different backends it supports like you can call an API you can get the translations from an API you can also use other backend calls so you can use different backend approaches for now we're going to work with local Json files to keep things simple so again we press enter we're going to to install it and there we have it we can kill that terminal now but we have to keep this terminal alive if we want to keep the react application running we close the terminal in the X and again if we go to the Explorer to the package.json file now we see that we have I8 next I8 next HTTP backend as dependencies and we also see react I8 next so we will be working with the three of them right now after we have them as dependencies we will need to import them we go to app.js and we're going to import specifically i8n from i18 next we're also going to import HTTP backend from I8 next HTTP backend we see that it's Auto completing so that's really helpful and then we're going to import two things actually from react I8 next you can see that we are using these three dependencies we're importing iatn we're importing HTTP back end and we are importing two elements here that we will be using I promise you we are going to add them that will be initial react I8 next and use translation this will be like a hook to use the translation where we need to we're going to use this to replace the hardcoded strings directly within the jsx elements if you want you can divide these import statements into a different like block because they're all related to localization that really depends on your personal style and the guidelines that you're following for your team and to finish off our import statements we're also going to use use state so we're going to import it here this is a normal Hook from react great so let's we can of course readjust these import statements as we need to if we want to group them for now we're going to keep them all together and then before the app component we have to set up the localization how are we going to do that we're going to use the iatn object that we have here that we imported from IAT next and we're going to call a few methods on this we're going to make it use the HTTP back end we're also going to use init react I8 next and we're going to initialize this to a few options within in it we have the curly brackets this is going to be an object with different options first we have a fallback language this is the fallback language in case the the user of the application selects a language that is not available or we don't have the translations if anything happens we will fall back into English and we also configure the back end where are we going to load these translation files from where are we going to take them well they're going to be available at a specific path remember the path that we saw in the previous section when we started talking about the extension in a folder named locals and then a folder for that particular language like this would be e n for English or ES s for Spanish JP for Japanese and for that for replacing that particular language here as a placeholder we use these double curly brackets that's a standard in IAT next the twet code and then we are going to store them in a file named main. Json we need to set that up in our file structure but for now we are configuring it in our Javascript file so now we have our back end set up we have everything set up we're using HTTP backend we're using react IAT next we have our fallback language and we are setting up our back end where are we going to look for those files that we want to serve with the local server we have everything ready to start actually working on the app and replacing those strings like this first we're going to set up our event our goal is that when the user clicks on one of these options from the drop- down menu when there is a change we want the entire translation to be replaced right the all the strings so we need to listen to that change we need to have an event listener we're going to add that to the select element on change that's the event and how are we going to handle that with the onchange function we Define the on change function over here within the app component const on change and here we have it we are going to use an arrow function for this this would be the event the parameter we can also call this e it's a a normal standard I'm going to call this event and just to test this I'm going to print this value the event has a Target that is the the the drop- down menu the element and the target has a value that value will be the value of the option that we are currently selecting so if we select Spanish the value will be es the value that we are setting over here that's the value that we are going to get from that event from the target if we select English we're going to get En n and that will be fundamental here to handle the change so let's test this and see if it works let's see if it works here we are in Chrome I just have it full screen so that's why this is still the browser if we right click and we click on inspect we can see the console and let's change this to English now we see e n if we change this to Spanish we see es s so it is working we are reacting to that event but how are we going to actually handle the event because we don't just want to print this value we want to do something with it when we change the language we want two things to happen we want the localization framework to know that the language was changed and we also want to update the language over here remember that this is still hardcoded it's still a fixed part of the string we want this to be dynamic and be replaced by the language so I'm going to take a relatively simple approach here you could also increase that the complexity and multiple languages but since we only support two languages right now I'm going to use a tary operator to change the language in the IAT n Frameworks to know that we have to load the new translations we call the change language method on iatn this is the same object that we imported here from I8 next then we call change language and then we pass as the argument the value that would be or ES or the the the value that we are setting for that option that is the twetter code for that language that will handle that from the framework side but we also need to change this value over here English we want to set it to English or Spanish and we're going to use a state hook over here to do that so we're handling both the framework and the text update simultaneously if you're familiar with hooks you know the Stak hook we have let's say language this would be our state set language and with the used State hook we're going to set English by default we can set the language over here so language and then if we have that state we can replace it over here instead of just writing English we can replace this with Language by wrapping it with curly braces next the next thing that we need to do is that on when there is a change we just update the language and we're going to do that in a very simplistic way for this uh purp for this tutorial we're going to just call set language and we're going to take the previous language that we had in the previous state and then we're going to check if it's English if the language was English then we are going to change that to Spanish if not not we're going to just keep English so that's our approach of course if you're supporting more than two languages you may need to to use a different approach but for Simplicity purposes since we're actually focusing on the framework I'm going to update this in a simple way so how are we handling this right now well you can see this working if we change this to Spanish this changed to Spanish if we Chang this to English this changed to English so we are handling that change appropriately but we don't see that these strings are changing in any way for that we are going to replace the text that we have over here because if we just write the text directly in the component the text will never be modified it won't be dynamic we need to change that to something that can change when the framework detects that the language has been updated to do that we just need to add a hook over here we need to have access to a hook named T usually the name is T and we're going to get that from used translation remember that we imported used translation from this react IAT next we're going to use this use translation to get the T hook and then we're going to use T this will be essential this one letter identifier here is going to make all the magic come true because we're going to replace these strings with something that we're going to get from the te and for that we need to set the Json file up first we want to remove these hardcoded strings from our Javascript file so for that we need to start creating our Json file and get all the English strings or the source strings over there usually you will find the locals folder like we have over here in the public folder so we create a new folder we name it local and then within local we create a new folder named I for the English strings within the English strings we create a new file make sure that you're clicking here on en instead of locals because the file has to be here in EN and we're going to name this main. Json you could choose a different name but I'm going to name this main so we have all the main strings over here make sure that it's within n here and then within main. Json we're going to Define our Json file with the key value pairs let's say that we want the key to be welcome here welcome and then we want the first line to be the key the key doesn't necessarily have to be exactly the same as a string okay it's just like a way to identify that particular string so this could be name and this would be the name or this could be address and this could be the address it it doesn't really have to be exactly the same text itself it's a way to identify that string across the different languages remember that the keys will be shared across the Json files in all the languages so they will stay in the language they were written in they will say in English this would be the first line of the text that we want to show this would be the second line we need to separate them with a comma and this would be the third line these are the keys they could be more specific but I'm just writing them like this first line Second Line third line for Simplicity purposes you can of course make them more descriptive so now that we have them in the Json file we can remove these hardcoded these fixed strings from our app.js file instead of just writing welcome here we can make this Dynamic by wrapping it with curly brackets and then calling T within parentheses we pass welcome as the argument this is the key of the string that we want to replace over here this is this value welcome welcome it's the key and that will tell the app our app that we want to use the string that corresponds to this key in whatever language we currently have selected that's what we are configuring here we're making this Dynamic but since the key is shared across all the different Json files in every language this is a fixed value that we can use in our app and we will still be dynamic then we're going to do exactly the same thing for the next component but now instead of welcome what do we want to replace here this string the key for that string is first line so we are replacing it over here then we do exactly the same but now we have second line and then third line this could be more descriptive if you're working on a more complex application I'm just keeping things simple here because we only have three lines like this and how will the framework know when the language was changed and what language it has to select for this particular Key Well it knows because here we are calling change language and this will be the two-letter code for that language so it knows that it has to look in that particular folder and get the corresponding Json file that's how we set things up over here when we are defining the local path it will look within the language folder for the file named main. Json if we check the application we should see the strings replaced voila now we don't have any hardcoded strings let's see this in our application let me close the Explorer right now we don't have any strings over here this final paragraph We are going to keep it this way because it's updating automatically it's in English so it helps us to keep track of the current language if we don't actually know the text so I don't know it's just I think a a small little detail that I would like to include or keep this in the demo so if you want to translate everything you can also take the challenge of localizing this as well but these four lines that we are focused on are being replaced automatically but if we change this to Spanish we see that nothing happens right that's because we don't actually have a Json file for the Spanish local we only have the English folder so how can we actually create the Spanish folder and translate that in crowding let me show you that let me show you this if we go to the crowding extension we see welcome back Stephania demo that's because I'm already signed into my account you will see this message if you're already signed in if you're not signed in remember that you can go to the command palet search for crowding and you can click a sign in you will have a sign in Command right now I have a sign out command and it's helpful to know this too that you can sign out anytime you like and then of course you can create a configuration file as well so for now we're going to create a configuration file create configuration the file is added over here to our react app structure at the root of the project and here we need to configure source and translation how are we going to configure that where are our source files the files that we want to translate we already extracted all the strings into our Json file and that's where our source string live that's the source language so we have to write the path to our source that would be locals then en n and then Main dojon and then the translations would be a bit different they would be similar to the path that we wrote previously locals then we would use the placeholder of two letter two letters code now you can see why the placeholder is very helpful especially for react this will create the folders dynamically like we had before when we installed the extension remember and then we're going to keep the original file name with this placeholder like this so we have our source and we have our translation we should double check these paths and they look okay if we have to make any adjustments we can make them afterwards and then since we need a project on crowding let's go to crowding let's go to crowding I'm going to log in again because I spent too much time outside of the platform so I was not locked in great so I'm back here and I want to create a new project this will be of course a public project we're going to name this free cam react public project The Source language is English and the target language right now will be Spanish we can add them later on create project and I don't have any sources but remember that we can upload them we do have the target language in Spanish but now I can select my project in VSS code I have my configuration file ready and I can open the command palet with command shift p then go to crowding select project it's going to load all my projects I'm going to select Freo can react like this and then uh voila here I have the files that I can upload the files that I can download and my progress right now it's 0% because I haven't uploaded anything but I can upload my files over here I'm going to change this to the asterisk asterisk Json if we only write locals here it's not going to work because it's within the public folder so I'm going to write public over here and now you can see that it is being displayed so I see public then I see locals and I see English and then I find my main doj Json file that's the Json file with the strings that I want to translate so let's upload the file upload source file remember that I'm already signed into my account uploading file main. Json once the process is completed if I refresh the browser I can see this in the sources tab I do have a public folder with the English folder and main. Json I can change this settings of that file within crowding and it can start translating Spanish then if I translate let's say welcome benos I'm going to save this translation this will bear then this will be conr Pro and then this will be obtain certific this is the the text that we have on the main free Cod cam landing page then I'm going to approve these strings just for demonstration purposes so we can download them to vs code like this and I reach the end of the file so I have it 100% translated and approve you can see it here if we go back to visual studio code now we can download the translations by clicking on this Arrow here we will also need to add public before the Local's folder to actually reach that path we need to write like the full path to that folder public locals and that's when we can actually download our files we can click here Download Project translations it's going to download the translations and after that if we refresh this you should have something like this in locals you see English and you see Spanish and inside Spanish you can see this Main doj on file we have the same keys but the strings are translated and we translated them on crowding decom and we did all of that through the crowding extension and of course we had to go to the online editor but it's super easy to synchronize your localized files with your local project the local folder can be inside the public folder or it can be inside the source folder it really depends on your personal preference the public folder is for files it should be available anywhere like the the Fab icon or any Json files some developers prefer to keep the local folder inside the source folder so it's really up to you but you just need to update the paths to reflect that change great so now we have the Spanish translations and we have the keys now if we go to our application and we change the language to Spanish here we can see that translated strings they are replaced automatically when we change the language with our method in the app component we see that the language is currently set to Spanish and then if we change that to English we see all the strings in English again those are the fundamentals of how you can use the IAT next framework for react and crowding to set up your translation workflow as a developer this is very helpful and you can also automate this further with other Integrations that can help you to automate the process even further but these are the fundamentals so great work you're taking big steps into this world of localization if you want to add any other languages Beyond these two you would need to change the logic of the app.js component of course because here we're only handling two languages to update the text and if you want to have more languages you would have to add more options here in the drop- down menu each one with it some particular value it's twet code the standard code and then you will also need to have a main. Json file for each language you will need to translate that in crowding add them as Target languages translate them and then download the translations awesome now that you know how to translate your application or website in vs code with a crowding extension for vs code we're going to start diving into the GitHub extension because this is a way to keep crowding and your GitHub repository synchronized if you're planning to host your project on GitHub it's like a way to automate the process it will make it so much easier let's go to crowding dcom to my profile and I'm going to create a project of course this will be a public project because I am in my free account so free Cod cam GitHub this will be the name of my project free Cod cam GitHub we're going to test the GitHub integration to see how it works this is a new option that crowding added from my previous the previous parts of the course they're constantly adding new features and things that you will see in in the platform compared to when I recorded them of course so don't be surprised if you see anything marked as new you can also enable string based project but right now we're not going to work with with that the source language will be English and the target language let's select Spanish for now let's also select Japanese and Italian just as an example just to select a few of them let's create the project project created successfully free code cam get home and right now we don't have any projects to translate that's intentional because we're going to import them through an integration we're going to to add an integration remember that with the free plan you can only have one integration at a time and the integration that we're looking for is the ghub integration we click on it and we install it this application will have access to your projects and it will be displayed in the project menu Integrations GitHub the users that will be able to use the app will be only me you can also customize this to fit your needs select the projects where users will be able to use the app projects you own or selected projects I'm going to choose selected projects and only on free code cam GitHub I'm going to restrict the app to only work on free code cam GitHub so I'm going to install it and I see that it was successfully installed I can also uninstall it but for now let's close this and if I refresh the page now I see the GitHub integration here and I need to set up the integration to set it up I need to click here on on setup integration there are two different modes for this source and translation files mode and Target file bundles mode this is actually new and we can find more information about this it says that it exports sets of strings in one of the selected formats if we go to this article in the crowding knowledge base GitHub integration file based we will see the specific description for these two file modes for the source and translation files mode this will synchronize source and translation files between your GitHub repository and the crowding project this is what you'll use most of the time and they also have another Mode called Target file bundles mode this will generate and push translation files to your GitHub repository from the crowding project in the selected format in this mode the integration pushes translation files and doesn't sync sources from your Repository in cases when you perform a source text review in your crowding project and you want to get updated Source text to your repository you can add a source language as a target language which will be pushed to your repo along with translations this is a quick overview of what the crowding team explains about these modes but I highly recommend going here to their knowledge base to the GitHub integration article to learn more about them for now we're going to stay with the traditional mode here here I have my GitHub account I am going to authorize crowding you will need to do exactly the same you should read the permissions very carefully you will be granting access to your public and private repositories including your code issues pool requests weeky settings web Hooks and services deploy keys and collaboration invites the repos scope also grants access to manage organization attributes and organization owned resources including projects invitations team memberships and web hooks so I am going to authorize crowding here and use my authentication code now I'm being redirected and I can see the GitHub integration I will select my account over here then the repository the repository that I will be working with is localization GitHub integration after I select the repository I have different options that I can customize select branches for translation I only have a main branch right now so I'm going to select that and this service Branch name just means the name of the branch that will be created when crowding pushes the translation crowding will create a pool request with the updated translations with a new Branch so you can check the translations before you actually merge them this is ready but you can also change the branch configuration in the project we see that this is already because we already had a crowding do yamu file in the repository this is basically the the react app that we worked with in the previous example with the visual studio code extension I removed the Spanish translations but I kept the crowding yamu file so that was already configured if I click on this the pen I can see the source and the translation paths they're exactly the same as we had before we have public locals English and then the wild card. Json we can also change this to main. Json if we don't have this yamu file already created in the project we will be able to create it by customizing this path and we can preview the source files here we have we see that it's in public local English and then main. Json and then for the translated files where we want to store our translations we're going to store them in public locals then the two letters code and then the original file name here we have public locals and this would give us a preview of how we're going to store the translated files in our project structure this would be Spanish main. Json Italian main. Json and Japanese main. Json so this is very helpful to work with different placeholders if you click on this eye over here you can see a list of placeholders that you can use to set a translated file path and a name like this we have the original file name the original path the file extension file name language two letters code three letters code the local local with uncore Android code OSX code and OSX low count I encourage you to dive deeper into this placeholders because they are helpful to customize where you're going to store the translated files you can also select multilingual files so then we are going to save this and we can add a file filter this is a more advanced function we see that the configuration will be saved as crowding doyo file in the main branch so we save this and then we find more settings this setting will help you to deal with branches efficiently to set how you're going to handle duplicate strings across different branches because you may have the same keys and the same localization files the same source files in different branches how are you going to handle those duplicate strings you have many different options you can show them and translate each instance separately you can hike them you can share the same translation across all the duplicates it's really up to you what you do with these options but for now I'm going to keep the default so translators will translate each instance separately then I see these options over here I see onetime translation import after the branch is connected I can choose to always import new translations from the repository these two settings over here are related to how we are going to import our source files by default we see that we're going to have a onetime translation import after the branch is connected when we connect it right now we click on Save we're going to import our source files we can also push changes any changes made to the source files on crowding back to your repository if you make any changes to the original Source strings you can also push those changes back to your repository automatically but by default this is disabled because you will be changing the content of your repository and that's not always what we need and this is very very helpful for automating the process of synchronizing crowding with your GitHub repository this is the sync schedule it will set the frequency for pushing sources and translations to the repository 1 Hour 3 hours 6 hours 12 hours or 24 hours you can set your synchronization schedule the source files changes made on the repo will be synced with crowding continuously to reduce the number of the the pipelines configure the commit message parameter in the configuration file this is a bit more advanced beyond the scope of the course but you may dive deeper into this article if you click here on learn more and you can choose which branches you want to synchronize automatically and the default configuration file configuration file name for automatically synchronized branches if it's not defined then the crowding doyo configuration file is expected in the branch we do have that configuration file in our main branch so for now we're not going to customize this we're going to set our synchronization schedule to 1 hour which is is the default so we're going to click on Save over here and what this will do is it will start to synchronize the source files to crowding and it will show us the status it has been synchronized with our main branch we can pause the synchronization process we can edit this or delete the integration we can sync our repository right now manually by clicking on this button and we can sync our translations back to crowding if we already have some pre-existing translations if we click here on the data for that particular Branch we see that it's when it was last synchronize the status and we can synchronize that particular Branch synchronize translations to crowding or we can change the branch configuration we can also see any issues that may arise when crowding tries to synchronize the translations now let's see what happened with our project because so far we're just configuring the integration but we can see that it was successful so if we go to our dashboard and we check our Target languages now we do see the main. Json file over here you can see this in the sources tab two if we go to main because we're in the main branch and we go to local English we see main. Json that is awesome right and what happens if we go to a specific language like Spanish and let's say that we are going to translate a few strings we have four strings over here welcome let's translate this and save it let's translate a few strings and then we're going to synchronize the translations back to the GitHub repository bidos yes I'm going to approve this learn to code for free build projects earn certifications I'm going to approve all of these translations and then I'm going to synchronize these translations with my GitHub repository to see what happens here I am in my GitHub repository and I can see that in my GitHub repository crowding already created this Branch the internationalization main branch like this this branch is three commits ahead of Maine and I can see that some new commits were created if I go to my commits over here I can see that I have a new translations main. Json for Spanish for Italian and for Japanese these files were created automatically by crowding over here but they will be replaced by their corresponding translations once I start to translate in the platform so let's do that I have that file already translated into Spanish and approved so if I go here to my Integrations and I really don't want to wait that hour that I set up to synchronize the new translations with my repository I can click on sync now I'm going to sync it now and I will see that the status will be sinking sinking and it's still sinking it might take a while and if I go to my GitHub repository I see a new pool request new crowding updates new crowding updates new translations for main. Json in Spanish Italian Japanese and here I have Spanish if I go here to my Branch I can see that now it's four commits ahead of Maine I had a new commit when I synchronized that brand over here and if I click on it over here at the bottom I can see that now these strings were replaced previously they were in English by default and now they are in Spanish with the translations I submitted and approved now I have them in my Branch over here the branch is four commits ahead of main so I can check my translations very carefully before I decide to merge them with the main branch then I when I check them I can compare the this Branch with my main branch and I can see that they are able to merge so they can be automatically merged in GitHub if I want to I can just merge the branches in the pool request I click on view pull request over here and then I can merge the pool request I can also change the the description over here of the pool request and everything was done automatically if I merge the pool request I will be merging the translations into my main branch and I will be able to keep those files in the local folder you can see that these files were added and this is located exactly where I wanted to be public locals Spanish main. Json now you know how to use the GitHub integration remember that it will send you a pull request it will send a pool request to your repository that you can merge to your main branch and it will send it to the localization main branch or the the name that you assign to that particular Branch it's very helpful because that that way you can check the translations before you merge them in the live version of your project this is basically how the GitHub integration works if you want to check your branch configuration you can click on the ellipses Branch configuration load configuration from crowding yaml continue and then you will B basically see what we configured when we set up the integration you can change the source and the translation path like this if you click on it you will be able to change the source path and the translated files path with the placeholders that you can see over here they're all very helpful to create the path that you need for your application or for your project remember you can preview the source files and the translated files and how they will look and where they will be in your project structure if you you want to pause sync you can click here on pause and you can resume whenever you need to like this you can also edit the settings for the GitHub integration like this to change the sync schedule let's say that I want to change this to 3 hours I can do that and save it and I can also delete the integration so I don't use it anymore if you want to delete the integration then you can click here delete integration delete this integration well first I would suggest pausing the sync just in case and then deleting the integration remember that you can only have one integration per project if you're on the free plan so I'm going to delete it so you can see how this works and then well you can start from scratch again to set up the integration with the mode that you choose but this is basically how the GitHub integration Works in crowding it's way to automate the process basically what we were doing with the VSS code extension manually now we can do that automatically through GitHub I hope you found this helpful so let's continue to the next part of the course congratulations on reaching this part of the course now you know how to translate your website or application in vs code with the GitHub integration and now we will see a third option which is actually a bit simpler and it may be a good alternative for static content like a blog or a landing page a personal portfolio that type of website that is mostly static where all the content is already there when you load the page and that option is called ajs proxy a JavaScript proxy we will be translating the strings from this sample website you can see that we have some strings in English that we translate let's say into Spanish or into other languages we also have some Lauren Ipson placeholder text over here but we won't to be Translating that in this example we will translate the strings that we can translate here that are not placeholders so let me show you how this works it's very easy to set up with a crowding integration for that we need to create a crowding project we're going to name this free code Camp JS proxy you can see the project address it's a public project The Source language will be English and the target languages will be Spanish Chinese simplified and Hindi just to select some languages of course you can always change this list or modify it afterwards but it's just to get started with a project and what we're actually going to do is translate them into Spanish great so we have our project free cam JS proxy The Next Step would be to add the JS proxy integration we go here to the Integrations Tab and remember that with the free plan you can use one integration you can add one integration per project so you click here on ADD integration and then you browse the list JS proxy translator this is a free extension that allows you to translate content with proxy translation technology and what is a proxy a proxy is like a server that acts as an intermediary in resource requests from the client to another server so we're basically adding like an intermediary in the process of actually retrieving that website and seeing it this will be translating our website very easily it will basically crawl the website extract all the strings that can be translated we will be able to translate them in crowding and then synchronize that so people can see it live on our website you can see it here it will crawl your website and extract all the translatable text in your project you will find a new file with text for translations once the translations are ready you can add them to your a website using over the air delivery we will see how this works in just a moment you can also find more information here in the apps and integration section we're going to install this and we can see that it will have access to our projects who should be able to use the app only me in this case only me again and where will we be able to to use the app only in the selected projects the free cam JS proxy project like this we're going to install it and here we can see that it is installed successfully that's great so after we have that integration installed if we refresh the page now we will see the JS proxy translator integration let's go into the details where we can set up the integration remember this is mostly used for static content content that will not change while the use is actually reading or seeing that information it's not for dynamic applications it's more for like blogs or landing pages where the content is already there it might take a few seconds but it will load and here we can see how to set it up synchronize all source files with your project and send new translations from the project to your website immediately so let's take a look at these settings how we can set this up remember our goal is to get these strings which are hosted here on my GitHub subdomain my personal subdomain in this path localization JS proxy this is a project that I created in a repository on my personal account so let's see the first thing we need to do is to specify the site URL this app will crawl your website and extract all translatable text in your project you will find a new file with text for translation so we have to go there where we are hosting our website copy the URL over here copy it copy it and then we paste it over here like this then in application mode we have two different modes server side which is default the application will scan the content on the visible pages of your website or client s your website administrator needs to add a JavaScript code snippet to each page this mode is useful for internal pages with authorization then if we check the site settings we can also configure the different site settings like separate files for each page if you want to have separate files for each page you can enable this option otherwise all the text will be imported into one file that's interesting that's something to keep in mind it's it might be a very important setting we can also have a page limit when you're testing the technology because website crawling takes time you can set the limit of how many pages you actually want to translate the default is 10,000 you can also specify the IDS of the HTML tags that you would like to be skipped during the sources import it's very important in case you don't want to actually import some of the elements the text from specific elements on your website use commas to separate the IDS you can also ignore the text or Elements by CSS classes that can be helpful too and you can specify which paths you would like to craw if this is not specified then all pages will be imported these are some examples of paths and how you can include them like about page article comments if you have multiple pages right now this is a simple onepage portfolio website okay we just have a basic information contact information like recent work some links articles testimonials and some contact information over here here we have internal links they are not links to other pages but if you do have multiple Pages you can configure this directly in crowding with the paths and you can also exclude paths finally we can see language detect type this setting is basically how the language will be detected it can be a query parameter this is the default it can be a subdomain like en here some websites use a subdomain for the localization for the internationalization process this would be the English version then you would have es for Spanish and then you would have your website.com or your main website domain or you can have a subdirectory like for example slem like this in this case we're going to keep the default for now maybe we need to change this in the future but we're going to keep the default and here we can see that after we add the JavaScript snippet which is a snippet that we will need to add to our code we need to make sure that we add this class in the body tag to avoid swapping translation swapping on page load how do we want to sync the source manually or daily this is very important for automating the process if we do it daily we can Auto Import once a day if we do that manually we can import it now and we also find options for publishing the translations the latest translations will be available for overthe a delivery for your website you can sync the translations manually or daily once a day and this is another tool crowning in context which allows you to translate directly over the website that you're translating but that is beyond the scope of this part of the course we will talk about it in the next part but if you need to publish your translations just click here on publish here you can import the strings and here you can publish them again you can do that manually or automatically once a day and finally here we see the language switcher this will be a JavaScript snippet that we can add to our website like we do with Google analytics this will let your visitors see the language switcher which is like a very small box at the bottom right of the website that users can use to change the language remember you must add the scanner snippet for each desired page so this snippet that we will see right here after we import the translations should be in every page that we want to translate let's import our strings now yes we have the right side URL so I'm going to import them import now we're starting the crawler let's see what we get this may take a moment might take a while because the crawling process is timec consuming so it will scan all the pages of your website you can see that now this says Distributing and we can see that the publish process has already started let's see what has changed in the project we may need to wait for a few seconds or minutes until the publish process is completed but while that is running we can go to our sources Tab and check if we have anything new there we you can see that it is loading so the process still running if we go back to the Integrations tab now after the process has been completed we will see this JS proxy generated and imported a source file a SL stepan cn. github.io dojon with your website text into the project it was last imported a few moments ago here you can also read more about translation strategies but if we we go to the bottom here we can already see that we have the script that we have to add to each page that we want to translate this is a language switcher and we will see it in action in just a moment but we can copy it here to our clipboard now if we go to sources we will see a new Json file and if we go to dashboard we just need to go to our target language Spanish click on it and then we will see all the strings that the web crawler extracted from our website and notice how easy it is to start translating let's translate a few strings like this about me projects testimonials contact we're going to translate the first five strings of the website and I'm going to show you how you can have a partial translation and translate it step by step and then synchronize the translations back to your website so we're going to approve these strings because you should approve them before you actually send them to the to the website to the live version of the website you can also check the quality assurance issues if you're sure that the word is actually written correctly you can just approve it like this and that's it we have the first five strings translated if we go back to the dashboard we can see some progress in the translation for Spanish so if we go back to the Integrations we go to the JS proxy translator for if we go back to our project we won't see any changes what crowning just did was calling the website and it extracted all the text from the website but how can we actually switch the language we need to add the language switcher we need to do that in my case I'm storing this in a GitHub repository so I will add this language switcher to my HTML file this is a basic website built with HTML CSS and JavaScript so I will add this to my HTML file and push a commit to my GitHub repository I will copy the script then I will go to visual studio code like this to the actual project and over here in head here we could add it at the bottom let's add a comment that this is from crow in we can format this nicely in the head dock we're going to add a script and we're going to add this style and over here we also see in side settings remember that we saw that for hiding translation swapping on page load after adding the JavaScript snippet make sure to add the JS proxy blur class in the body tag so we're going to add this class to our body tag this is something that is a bit like hidden here when you expand the site settings but it might be important if they are mentioning this so we're we're going to do this to avoid any potential issues JS proxy blur great so now if we check Source control yes we have the new script we have the new class and that's what we're going to commit to our repository so let me Commit This with the terminal I'm going to add a new commit to my repository and I'm going to describe it as adding a JS proxy adding the JS proxy script then I'm going to close this and I'm going to push it to my main branch in GitHub you might have to check if there is sensitive data that you may not want to publish here in the HTML file something you might like to keep to yourself okay so after we have that in the HTML file of the repository the site may take a few minutes to build again here we can see the the status the pages build and deployment status is in progress so we just need to wait until this is completed we see that it is pending and if we refresh it now we do see this little language switcher look at this it's really really nice we see that it's powered by crowding and it has our Target languages Spanish Chinese simplified Hindi and our source language English which is the current language let's see what happens if I switch this to Spanish right now nothing is happening why because we need to publish our translations we chose to publish them manually right so we have to click here on publish now publish now it might take a few seconds or a few minutes to update and you may need to refresh the website a few times while you're waiting but eventually you will'll see the strings replaced over here amazing right we have this in Spanish this is a string we translated and we have the other four strings here about me projects testimonials and contact great the language switcher worked here we are in Spanish and if I switch to English they are replaced automatically like this Spanish and English it's amazing right we also see this string being replaced English and Spanish you can continue the same process until you translate your entire website with all the different pages it currently has and you can see that the language switcher is adding this to the request it's adding the language that we are requesting as an identifier for that JavaScript the JS proxy the JS proxy is acting as an intermediary between the server and the client the original server of this website and the client if we try to continue translating let's say that we are going to translate additional strings like let's translate a couple of them we see students so let's translate it and see how we can again publish our new translations and we will see them in the website with the JS proxy right now we're doing all of this manually because we haven't set up the automated synchronization to daily but we're going to continue doing manually for now for demonstration purposes but you can automate this and do this daily after we publish them we will see them since I'm activating that blur you may see it blurry while you're refreshing while the translations are being loaded and here you can see this this is a string that we translated student in Spanish now if we switch back to English you will see the original strings in English so it's as easy as that I would suggest practicing this with other languages or with different projects but it's actually quite simple for translating static content remember this is not for dynamic content that will change over time all the content should be available before you actually start to crawl the website so you can get the full list of strings and translate them appropriately with the JX proxy integration you also have some additional options here that you may like to work with or customize like reviews strings to review you can import all of them you can clear the process cache import it and delet it and right now we don't have anything to display here but we may have some strings that need review we also see variables you can create patterns to replace similar strings with a single string containing placeholders for example replace strings like hello John hello chane with a single string like hello name you can set the pattern here with ADD pattern like this then you can use a title for a placeholder that provides translators with a clear understanding of how the rest of the string should be translated the placeholder would be this like username and it should be within double curly brackets that is an advanced feature a more advanced feature that you may like to dive into but I'm just showing you this in case you would like to use it in your project we can also see logs displayed um over a period of two months and here you can find help for this integration this is also very helpful and actually there is something that I would like to highlight here we know how it works right now you can read more about this to understand the details and the different modes but over here we find something quite interesting we can see the language switcher customization yes you can customize the language switcher to change the position submenu position and the a class if you would like to add a specific custom class to the language switcher you can set that with these parameters over here you can see them here in the script that you will need to add to every page that you would like to translate here we can see position top right if you want to customize that for a sticky position then for inline position you can also use inline left or right or any of these values for sticky position the submenu position you also have these four options and then the class would be some value for your custom class any class any custom class that you would like to assign to that language switcher and here you have more information in case you would like to add a call back to the language switcher which will be invoked when changing the language on a website this is helpful to detect when the user is changing the language so you can react to that so you can handle that appropriately the Callback can pass two arguments language code two letters language code for example here we have the script again but here at the bottom we also see the Callback in the Callback we are defining a JavaScript functions we have the language code as the first parameter and the two letters language code as the second parameter and over here we're just printing that the language changed and the message is descriptive because it's using the values of the parameters but you can customize this to fit your needs in case you need to do something in your code when the user changes the language so you can customize all of this I encourage you to read this help article when you install the JS proxy integration awesome work now you know how to use this integration for translating static content great now let's talk about crowding in context this is the last technique that we're going to cover in the course for translating a website crowding in context is great when you want your translators or your community to translate the strings that you currently have in a project in crowding directly on top of that website app or platform they can basically click on the string translated see a preview of the translation live on the website where it should be and the changes will be automatically synchronized between your a and crowding so I will show you the basics the fundamentals of how you can synchronize that and how you can set it up here we have our localized app example this is our basic react app here it's already running so I'm going to open this in my browser and we can see it over here free go gam welcome learn to code for free I just made a few modifications because now we will need to support multiple languages because we will have a pseudo language to configure all of this functionality a pseudo language will be like a template with additional information about the strings that crowding is going to use to get the information it needs for the translations so instead of here saying English or Spanish I am just showing the twet code English Spanish and we're going to use Africans as a pseudo language this the pseudo language should be a language that you're not planning to translate your content into Okay so so if I'm not planning to translate my website into Africans then I can use that because the language itself will not be available it will be used for placeholders that crowding will need to get the translations live and synchronize them let me show you the changes I made to the code compared to the previous versions because now we are supporting multiple languages here in the unchange method now I am setting the language to the value of the current Target the option that the user selects from the drop- down menu and it will be one of these values en N es s or AF I added this third option for Africans because to enable crowding in context you or the user the translator has to select that particular language to activate the entire functionality okay so that's one of the changes and the other change is here in the initial State instead of English now I have en n which is the twet code for English since all of that is set up we need to go to crowding Enterprise and here I have a project named free code cam in context tutorial these are the target languages I selected Bengali French Hindi Japanese and Spanish this feature is available for teams and for crowning Enterprise if you're representing an open source project an organization or an educational project then you will be able to configure this in your project to do that go to sources and here we need to upload the file where we are storing the strings that we want to translate we're going to do that manually for the purposes of this demo of this simple example but you can automate this with the techniques we've seen you can add the GitHub integration and synchronize all the files you need automatically for now I am just going to go to this folder or I can also go to my vs code over here where I have my files and I'm going to take my main. Json file where I'm storing all the strings the original strings the English strings to upload the file by dragging and dropping it I am going to right click on it I am going to open it or reveal it in finder I'm using Mac OS in Windows you also have an option to see the path to the file and open it and here I'm going to drag and drop it to this area that will start the upload and once the upload is completed you will you will be able to go here to the tools in the tools you will find in context over here if you click on it you will reach this part in context for web crowding in context tool provides an overlay for your application translators can make translation in context and instantly preview them by default it will be disabled if you want to enable it just click on this button and then it will change to enabled and here you see the two steps that you need to follow it's it's actually quite simple let me show you the first step is to integrate a new language into your application since localization and translation is very technology specific there are many ways to do this I'm just showing you a simple example with a react app and the I next framework but this will depend on the technology that you are using for your application to enable in context localization you will have to switch your application to this language so if if you have some way of switching the language of your application like a drop down menu or a query parameter or any other approach then you will need to switch to that language that we're integrating here this is a pseudo language like you can see over here we need to integrate that but we have to choose it first this should be a language that you're not planning to translate your content into so in this case I'm going to choose just as an example Africans you could choose any other language that you're not planning to translate you can choose if you also want to translate hidden strings or disable this I'm going to keep it enabled it's enabled by default and you can see here the twet code of the language you selected and the local code this option should be disabled if hidden strings are used for metadata and should be original for the web or the apps functioning okay something to be aware of so after that we click on download and then we open a folder that we downloaded this will be a zip file we just need to unzip it the folder will be named AF when you unzip it and inside that folder you will have a main. Json file this is a file that you have to add to your application in some way depending on how you're structuring your file where you're storing your translations and your locals if we check the content of the file you will see that it's actually quite interesting if we go back to visual studio code we just need to drag and drop this folder here into my local folder which is where I'm storing all the translations it should be at the same level as my English folder let me just make this full screen now we have two languages we have English and we have Africans if we open the Africans Json file you will see that it's not actually translating them into Africans it's just giving them crowding specific identifiers for crowding in context so that's why why you shouldn't plan to translate your application into this pseudo language so choose it carefully when you set this up after you have that you also need to make sure that the application will handle switching to this language appropriately right now if I go to my application I can see that I added the option for afcons and it will handle it correctly like this now if we switch to this language instead of the translations because we don't have them we see just the crowding identify but this is not working yet because we need to take a second step if we go back to crowding Enterprise now we go to the JavaScript snippet setup we need to paste this JavaScript snippet in our head section in the head section of the HTML document or the document that you're working with before any other scripts every page it's important to read this every page with a localizable text should contain this script you can also include this JavaScript snippet only when the pseudo language is active so let's copy this and let's paste it where we need it to be they mentioned that it should be in the head section of the application in a react up that would be in index.html this would be the head element so after that after I'm going to place them below the title here and I'm going to fix the the indentation like this it's just this couple of script texts and that will create all the magic you can see that we have like a code for the project and a domain and we also see this script with a specific Source from crowding CDN the content delivery Network so now if we go back to our react application now we see something special over here you may see this warning first because there is nothing to translate with crowning in context because we're not in the Africans language yet by default we are in English in the application so if you ever see this just click on close you might also read this to know what would be causing it but if it's not an issue really you can just close it and here you can see this preview we see this preview and we can move it anywhere we need to and what are we seeing here well we see all the strings that we can translate for that specific page we're in we can also type to search for a specific string we see like a summary for the left panel of the crowding editor tool but it's right there directly on top of our application we can also click here to take a screenshot of the current screen and upload it to crowding and we also have some settings you might also get a signin screen the first time you launch your application where you will need to choose your target language and you will need to log into crowding and then go back to your application I have I've already done that in this computer so that's why it's not asking me again to sign in for the same application but here I do see croing in context and I can change those settings here in the settings tab the language the target language is Spanish I can also change this if I'm going to translate to a different target language at the moment I cannot select a workflow step from my Enterprise workflow I can change this preview the translations or not highlight them and list only text from the current page I can also log out from my account and let me show you this I'm going to log out momentarily and then log back in so you can see how this works I'm going to log out and this is exactly what you will see when you launch your application this is the target language you need to choose it and the workflow step and then you log in with your crowding account you will be redirected to your crowding account you can send a magic link if you want to and after you click on the magic link you you will be redirected to your react application where you can start translating exactly what we had before right but now when you start translating what happens if you switch to Africans which is the pseudo language well the pseudo language will enable the overlay on your app and you will be able to click here on this little icon next to the string that you want to translate this will open like a more compact version of the editor where you can submit your Translate you will need to use cookies you can customize them reject them or accept them I'm going to accept them and here you can write your translations let me translate this welcome I'm going to translate it like this and then if I save my translation you will see what happens instead of being red now it's green because I translated it and if I have the permissions I can also approve it as a prove reader once it's approved I will see a check mark I will see all the revision history here as well and if I go to my project in crowding Enterprise now if I go to the dashboard I can see that there is a progress here 9% in the Spanish translations let me continue translating this I'm going to save this then I'm going to translate this like this and then I can just approve them as a proof reader and it will be synchronized automatically now you can see a green dotted line around the strings in the overlay and we can see the preview over here if we switch the language to Spanish we are not seeing this the translations because right now we don't have that locally in our project but we do have them over here in our project so if I choose to download this Json file in Spanish like this main. Json I can just download it I'm doing all of this manually of course but you can automate this with all the tools you learned before I can drag and drop the file in Spanish over here to the folder and now if I refresh this in the application I will be able to switch to the Spanish version very easily with the translations I just saved but crowning in context will be activated for specifically Africans when you select Africans if you want to translate into another target language let's say Japanese now I can change this to Japanese while I'm still selecting the Africans language in my app if I want to change the target language I need to make sure that I click here on change okay that will change the strings that I am the status of the strings that I'm translating because they will be the same for all the languages but they statuses will be different or might be different let's say that I'm going to translate into Japanese I personally don't speak Japanese but I'm going to use this machine translation I'm not sure if this is 100% accurate but let's save it so you can see how it works and now I submitted it and approved it and you can see how the status is being updated now if we go to Africans we can see the preview of the translation in Japanese and if we go back to our project in crowding and and we refresh this we see a progress in Japanese we see 9% now if we go to main. Json in crowding we can see that this translation was successfully saved and approved and we can also work from here from the main editor in crowding or in crowding in context so we have these two options and it's always great to see what We're translating in the context of the real application great now you know how to set this up this process is a bit more detailed and it really depends on how you structured and configure your app and the framework that you're using for internationalization in this case I was using IAT next for react react IAT next but for every framework you just need to check where you're storing your translations then choose a pseudo language download the file upload your original strings files then download the file for your pseudo language the pseudo language that you chose from crowding and then follow the steps that we just saw please feel free to review this part of the course to set this up in your own application and the crowding team is also available if you need help here in the tools panel if you go to in contacts for web at the bottom you can see that if you need assistance with any of the stages above you can contact the crowding team if you need any help but these are the two main steps awesome now you know how to work with crowding in context for web awesome congratulations on reaching this part of the course now that you know how to translate your project on crowding let's see how free Cam's Community is translating the content into many world languages we'll see this from a potential contributors point of view emphasizing how to translate our content on crowding so this time we will see this from a contributor's point of view how you as a contributor can translate resources for free code Camp if you are a contributor who is interested in joining our translation effort where should you start you should start by reading our contribution guidelines here we are in our contribution guidelines contribute to freec cam.org you can contribute in many different ways but here we're focusing on translation so you would click here on help us translate and you you will see this we are localizing free cam.org to Major World languages you can see all the languages that we have available right now if you're interested in translating here is how to translate free Cam's resources so you can click here on this link or you can click here on the sidebar on work on translating resources and that will take you to this article first of all prepare yourself for contributions there are no speed limits you can start by reading this announcement we recommend joining our community forum and our Discord chat server if you click on these links let me open them right here so you can see them you can find Quincy larsson's announcements Quincy Larson is the founder of free Cod cam he wrote this article to help you join the localization process how to help translate free code cam into your native language you can read this announcement this has the major steps that you should follow for the localization process and after after that you can also go to this link over here this is the community Forum the community forum is where you can ask questions we also have a Discord server that you can join you just need to choose your name and click on continue to join you will need to register and you will be taken to our Discord server where you can ask questions we have special rooms where you can talk about the localization process and get started you can transl as much as you want when you want it's only a matter of how much time and energy you are willing to invest as a volunteer translator we just ask you to understand the following translations are a team effort it is a fun and rewarding experience but it works best if you involve your friends and colleagues who speak the same language as you we also have the goal of providing education in as many languages as possible but it costs quite a lot to keep the engines running so Freo cam is committed to providing these for free as always but we need to prioritize resources for those who need it the most for translating the curriculum once a language reaches at least a few certifications we can begin deploying the language live on our learn platform where you can find the curriculum we looked at our user base and added 30 more than 30 most widely spoken languages to the list of enabled languages on the translations platform which is crowding we are definitely looking forward to adding more languages to the list but it would only be feasible if we get enough momentum around a language I am covering all of this really quickly you can go here to this link to how to translate files on fre Cod Cam's contribution guidelines to learn more about this and read this in more detail I'm just giving you a general overview now we go to the overview of crowding but of course you just watch the score so you know a lot about crowding let's just go through this really quickly to help us with this massive effort we have integrated our open-source codebase and curriculum with crowding a tool to help us localize our codebase we use a different tool and workflow for translating articles in the Publications okay so crowding is being used for the curriculum and code base the translation workflow is split into two main activities translating and prove reading and we saw those roles during the course right so now you're seeing all of these Concepts in a real world project everything that we saw is a part of the course is being applied here in a real project that is live with a global Community we translate curriculum files documentation and UI user interface elements like buttons labels and other elements you can sign up to our translation platform and contribute with any of the 30 languages more than 30 languages enabled in the platform you can also be a proof reader to verify the translations to get started you should say hi in our this score where we publish updates then head to our translation platform and log in okay let's open up our translation platform here if you click on this link you will see that once you're in here in crowding in our project you will see these three featured projects coding curriculum user interface and documentation we also have other projects but these are the main ones you will also find an about tab where you can find more information about free code camp in the open project you will need to click on one of these projects let's say that you want to contribute to the coding curriculum once you're in there you will find many different elements first of all you will notice a list with all the languages that we have enabled more than 30 languages and you will see their status here on their status bar here you can see the number of words to translate in each language you can see the progress here on the progress bar you can see that the green bar represents how many strings have been approved approved means that they have been translated and pro read and then the approved reader approved the string to be live and we also have a blue bar that represents how many strings have been translated how many words have been translated let's say that we want to check the project for Spanish if we click on this language and we see Spanish modern we go into that project specifically and we can see all the files that we can translate we see the project structure if you need to collapse or close a specific folder you just click here on the small arrow and you will be able to expand or collapse that folder the files will still be there but you will not see them it might take a while but after that you will see the progress of each file as well and you can see them here as numbers and if you want to start contributing or translating then you would also need to choose a file to choose a file let's say just to click on a random file let's choose one from this certification scientific Computing with python let's just click here and if you click here on a file you will be taken to a login page you can log in over here into crowding Enterprise and you will need to log in into crowding Enterprise to have access to free code cam as an organization and to contribute to the project so you you enter your email or username you enter your password and then you log in you can also click here to get a magic link and you can log in with Google Facebook GitHub or your ex Twitter account if you're new to the project then you will need to sign up you can sign up by clicking here and then you will need to enter your email username and pass password agree to the terms and conditions and you may need to do some extra verification here for cloud fler and create your account I already have my account so let me just sign into this if you log in and you already have an account crowding will ask you if you want to stay logged in we can remember your session so you wouldn't need to log in as often you can choose to keep me logged in or not now I'm going to choose one of these options and then I go into the file that I selected because remember that we were in the free code cam coding curriculum project we clicked on a file and now we go to that file and we're back at the user interface that you are already familiar with after taking the course that is how you can start translating our resources technically how you can actually get to the resources if you go to our project again once you're logged in you will also be able to choose the the project you can log in from here after you log in if you don't see your profile here here you will see a login button that you can click on and after that you will see your profile image the organizations that you manage or that you're part of and your notifications as well but here let's say that I am in my account I already locked in I can go to the coding curriculum I can choose a file and now I will see some changes if I am logged into my account I will see go to editor and I will see these files it might take a while to load the progress of the files if you click here on hide completed you will not see the files that have been 100% translated and approved like for example here we have one of these files if you click on the button you will hide them that can be helpful as well to save you some time and reach a file that needs your help after that you also have the option to go to the editor if you click here you can go to the editor and help with strings that need help great that that is how you can start translating our coding curriculum but we also have other projects like the learn user interface and contributing documentation if you go there you will see the same project structure you will see the different managers you will see the same list of languages but you will see different files because that that is the version of the documentation that we are currently reading in the course okay if you would like to help with this you can also help us with this but the interface is very similar for all the projects now how can you translate the learn interface let's go back to our documentation if you would like to help translate the learn user interface like the buttons and the labels if you don't want to contribute to the curriculum and instead you would like to help translate the interface we also have a project for this and our documentation mentions that to translate the learn interface the interface relies on Json files remember Json this is another format that we talked about during the course it is loaded into uh an internationalization this is a numeronym the internationalization plugin to generate translated text this translation effort is split across both crowding and GitHub so if you are going to translate the learn interface you will need to read a little bit about this these Json files contain information that need to be updated to reflect your language but they cannot be uploaded into crowding as the content isn't something that would be a onetoone translation so these files will have to be maintained by your language lead but you're welcome to read about how to translate them in this link on crowding it's also important that you do not edit the following files through a GitHub pool request like these Json files intro and translations are translated on crowding in the project that we have for learn translating them can be a bit tricky as each individual Json value appears as its own string and sometimes the context is missing but the context information provided by crowding over here can help you understand where the string fits into the larger structure if you have any questions about a string you can reach out in the contributor chat that is about translating the learn interface because we have three main projects remember you can contribute to the coding curriculum the learn interface or the documentation translating the documentation is another essential task because this is the main resource that we use to explain contributors how to join free code Cam's Mission we share information steps and guidelines the the information that you are reading right now but we do have certain guidelines for translating our documentation our contributing documentation is powered by doif and we have special parsing for message boxes like this one so if you see this kind of string these words should not be translated and if you have any internal links you have to make sure that you replace them properly when you translate them because the internal links will be broken if you don't replace the ID of the target section with the ID of the translated document here we have an example here just make sure that the ID matches the ID of the element in your markdown files even after the translation so in the documentation we have many different details I'm just giving you a general overview of what you can expect right now we are focusing on these three main projects and finally we also find some best practices do not translate the content within the code text they indicate text that is found in code and should be left in English do not add any additional content if you feel a requires change in the text content or additional information you should propose the changes through a GitHub issue or a pull request that modifies the English file if you think that you need to change something in the challenge please do open a GitHub issue and do not change the order of the content okay to be consistent across languages if you have any questions you can also reach out on Discord and we will be happy to assist you at some point you may also want to become a proof reader right but how did you become a proof reader on free Cam's translation effort if we go down here we can find a section called becoming a proof reader if you have any questions or you're interested in becoming a proof reader feel free to reach out in our contributors chat room we will typically Grant you proof reading access if you have been contributing to free codam for a while so you'll need to contribute as a translator and then we can grant you proof reader access please note that crowding by default will allow you to to approve your translations if you become a proof reader however in general it's best to allow another proof reader to review your proposed translations as an extra safety measure to make sure that there are no errors awesome if you have any questions on the localization process or you would like to join our translation effort you're welcome to join our Discord chat server let me go back here we go to work on translating resources and here you can find the link Discord chat server there you can sign up create an account and contact us if you have any questions once you create your account and join the server you will see a welcome message with the start here localization Channel congratulations on reaching this part of the course you just completed the course and you're more familiar with the fundamentals of localization and how you can translate a project on crowding our localization management platform but the application that we buil and how we use the IAT next framework is just scratching the surface of everything that you can do with this amazing framework so here is a helpful tip for you you can go to IAT next.com to find the documentation for this framework there you will find a lot of information about the different features that it supports you can see that IAT next is an internationalization framework written in and for JavaScript but it's much more than that it goes beyond just providing the standard features such as plurals context interpolation and format it gives you a complete solution to localize your product from web to mobile and desktop here you can find a brief tutorial and you can see that this framework is compatible with many different JavaScript Frameworks and libraries it works with react angular VJs and many more you can also use I next with nodejs with Deno with PHP iOS Android and other platforms if we go here we can see all the supported Frameworks the list is not officially maintained so information here is contributed by the library maintainers themselves you can find more information here we can see that flutter also supports this for development for mobile apps react spelt next.js Angular JS angular here you can see that we do have some variations of the IAT next framework for example for react we worked with react IAT next and each one of them will have their own documentation but from the central website you can reach all of that information you have specific for angular for view jQuery HTML 5 and many more ember.js and the list just goes on and on like PHP rails it's very versatile and you have an entire ecosystem of libraries and fr Frameworks to work with which is always great if we dive deeper into the documentation we can see that we have a tutorial to get started with the framework you already know the basics but we used a very simplified approach for translating because our application was quite simple and it was a simple single page application this will give you more details about how you can use the framework like how you can use the API here in need and the different methods that you can call on the IAT next module like this here you can see a list of all those methods and if you click on them you can quickly scroll down or jump to that particular part of the documentation and they even include an example over here in JavaScript we also see the configuration options how we can pass the the options and a call back function you can find a lot of information about each one of these options over here a description we also see plugins and utils over here and we see typescript because you can use this framework with typescript as well here we also find information about the translation function like Essentials interpolation because with interpolation you can integrate Dynamic values into your translations that is great notice here like the basic interpolation example that we see over here we have the keys the key here and this string right but once we call the T we are going to pass this object and the value over here will be replaced where we find this interpolation in the original string so that is a great great feature working with data models as well you can also pass entire data models as a value for interpolation like this we have the author and you can pass it for interpolation over here there are many additional options that you can choose to work with you can find them in the documentation we also see formatting built-in formatting like plural rules list format display names number format local and date time format this is interesting because it will give you more information about how we can format these values we also see plurals over here how to handle the plurals with your keys how to handle nesting because with nesting you can reference other keys in a translation you can also add a context to differentiate the different translations for example you can provide gender specific translations and you can also work with objects and arrays to be used by third-party modules localization so you can find all of this information in the official documentation in the course I kept the example as simple as possible to make it General and as broad as possible for a wide community of Learners to get started but from here you can take this as your first step into the world of localization there's a lot to be covered here and you may dive into a more advanced course on IAT next I'm showing you like the basic principles and Concepts that you need to know you can also find best practices here that you should follow we also see translation resolution fallback name spaces and more advanced concepts this is for the IAT next framework in general but if you want to Di into a specific version of this framework like for example react you can go to react. next.com and here you will find the documentation and more information about this framework is specifically made for react and react native it's based on IAT next so you can find the general information over here in the general articles in documentation but you will also find specific information like the used translation hook that we used in our application you also have different components like the trans component and you can find a step-by-step guide on how to integrate it this is specifically for react but you can also go to the documentation of the framework for the technology that you are working with and after you dive into all the details of the localization framework you can also find more information about crowding where your translators or yourself are going to be working on the translations by going to crowding s base you can go here to support. crowding docomo here crowding KB where KB stands for knowledge base it's like their documentation where they keep all the details of their features and if you ever have any questions or doubts about how a feature works you can go here and check that in more detail you can see how how to create a project how to upload source files and they do have very helpful screenshots that you can check as well you can find translation strategies how you can manage a project project settings the translation process and the different features they have Integrations as well and for translators you can also find more information like a quick introduction to crowding information for volunteer translators and more information about crowdsourcing their account settings and how to join a translation project this is helpful as a an overview of the basic features for volunteer translators to get them started and ready to start translating your content they can also find more information about the translation process like the online editor with helpful screenshots and visual information so if you ever have any questions just go to crowding knowledge base and there you you will find the answers or of course you can always review the content of this course thank you so much for taking the course I hope you liked it and I hope you found it helpful for your localization project I will see you in a future course and I hope you have a great daylocalization is the process of adapting content to suit the language culture and preferences of a specific target market we've been using crow in to localize the freeo camp curriculum and articles in this course you'll discover how to use crow in to streamline your translation processes enabling you to effectively reach a diverse International Audience by embracing localization you can significantly enhance user experience broaden your Market reach and ensure your content resonates with people across different cultures and languages as Stephania teaches this course she is an amazing instructor who also runs the free camp.org Spanish Channel if you speak Spanish I encourage you to check out that channel if you're new to the world of localization this course is for you hi I'm stepania software developer and course creator for free code camp we will dive into the world of localization you will learn how to translate resources and software on crowding a localization management platform with all the features and a free plan that you need to get started but why is localization so important translating and adapting your content and your platform is essential for reaching a global community of users right but there are many details faces and tools that you need to know to get started and to reach that final translated platform where do you start this course is here to help you understand all of this step by step it's it's for everyone who wants to learn localization whether you have a technical background or not or whether you're an individual a team or an organization this course will be helpful for you you can apply these principles to any project that you need to translate that's why we will start from the basics my goal is to take you from zero knowledge of localization to working knowledge and actually being able to translate a website and manage a localization project or team on crowding this is our road map ahead we will start by looking at Freo Camp as an example of an organization that is currently managing a localization project worldwide and how we are approaching this task from there with this context we will dive into the fundamentals of localization including important terminology faces and roles this first part is based on Theory but that theory I promise you will be super important when we reach the Practical aspects of of actually localizing and crowding our localization management platform we will create a crowding account and we will go through the most important features of this platform to get started as an individual team or organization this will be an in-depth overview and by the end of the course you will know crowding in detail we will also cover how to integrate crowding with external services and platforms like GitHub and Google drive and how open-source and educational projects can get a free license for crowning Enterprise the last part of the course will be focused on actual development you do need to have some basic react knowledge to follow along step by step but only the fundamentals should be enough to understand what we're doing we will create a basic react app using the react IAT next framework then we will be able to switch the language of our react application and localize the text on crowding plus we will see four techniques and tools for translating a website including crowding Visual Studio code extension GitHub integration JS translation proxy and crowding in context for organizations when you complete the course you will know the theoretical and practical aspects of localization are you ready let's begin localization is waiting for us fre cam.org is an example of an organization an open-source project that has embraced the con conceptt of localization for reaching a global Community our coding curriculum is available in many world languages including English Spanish Chinese Japanese Portuguese Ukrainian and Italian actually if you go to our website right now and you click on this little icon at the top you will see a drop- down menu with these languages and you will be able to localize the platform automatically in just a few milliseconds and you will be able to learn to code in your native language that is the power of localization opening the doors to everyone around the world without any language barriers our community is also actively working on translating free codam into many world languages including Bengali Dutch French German Hindi Korean sahili and many more we have many world languages available for localization because our goal is to reach a global community so we have these languages enabled and available in our localization platform we also run localized Publications YouTube channels forums and other resources but this is a group effort this is an an amazing effort made possible by the amazing free code cam community and the members of the free code cam staff because our localization process has one main goal to remove any barriers that could prevent someone from accessing the education they need and deserve that is our goal and that should be your goal if you're planning to localize your product or resource remove any barriers and let people or users or your community come to you and learn or enjoy your product without any barriers one of the key features of our localization effort is that it is performed by humans for humans our processes focus on what matters the most our amazing community of Learners who waake wake up every day around the world excited about learning new skills we believe that language and cultures should not be barriers for learning knowledge should be accessible worldwide that is why we started this process and why we will continue our localization effort one of the key aspects of our process is that it is managed and run by humans for humans translations are written and approved and checked by our amazing community and staff because let's be honest usually anyone can tell when a translation has been generated automatically we can detect it we can see it it's much more literal it lacks the clarity and sometimes it feels disconnected from the context and the original tone of the text which can take away from the meaning of the text or the original message of the content human translators are much better at adapting languages and translating sentences in a way that sounds more natural in different languages and cultures at come we have an amazing community of contributors who dedicate their time to translate and check our translations and an amazing team of Staff members Who oversee the process with the goal of publishing highquality translations for Learners since we launched our localization effort more than 2,000 translators and 60 proof readers have helped us to accomplish our mission if this sounds interesting to you and you would like to join free Cam's translation effort please find our contribution guidelines in the description during this course we will also talk more more about our localization effort and how we are specifically using our translation or localization platform to achieve our mission but managing such a large project with a worldwide community of contributors might seem complicated right how can we accomplish all of this as a nonprofit organization you will get answers to these questions during the course we will cover this from the perspective of a nonprofit organization but the principles can be applied to any localization process that you need we will cover all the fundamentals of localization specifically we will talk about localization on a platform called crowding the course will start with General localization Concepts the process and the different steps and roles that you can have in a localization team after that we will talk about crowding for beginners all the fundamentals of how you can localize a resource or platform in crowding and then we will talk talk about crowding for teams and organizations because if you are representing an organization you will very likely have to work with multiple team members how can you organize your tasks how can you assign tasks to different members that is possible in crowding and in localization Tools in general so we will talk about them in more detail and we will also talk about crowding for developers this part will be a bit more Technical and we will talk about different features of crowding that developers can use to autom made and improve the efficiency of the localization process are you ready we will also talk about how to localize a website because that is usually one of our main goals when we create a website right if you're trying to reach a global Community your website should be localized and you will learn how to do that in crowding and you will be able to apply all these general principles to any localization process that you need to complete awesome so let's start the localization fundamentals section we will talk about the key Concepts and the key phases and roles of the localization process so let's begin great so now let's start with an overview of the fundamentals of localization and the steps you will need to take to make sure that your platform can be used without any language or cultural barriers specifically we will cover the concept of localization and everything that localization involves we will also talk about translation and how translation can be a bit different from localization and we will talk about prove reading which is another phase in this process it's very important and we will talk about it in just a moment we will also talk about the most common file formats that you will find in a localization process so you're familiar with them and you know what they do and what type of data they contain and we will talk about the faces and roles of the this process to make sure that your project runs smoothly you can have managers you can have translators proof readers and more so that is basically what we will cover in this part of the course the fundamentals what is localization localization is defined by the Cambridge Dictionary as the process of organizing a business or industry so that its main activities happen in local areas rather than nationally or internationally in the context of products and services and platforms localizing something really means adapting that to the language and culture of a specific population this also applies to software products and our course will be focused on localizing software products because they need to be adapted to different cultures as well and we will see how during the course software also needs to be localized and the platform that we will be working with crowding is a software localization platform why is localization important let's say that you are an organization with a global community and you keep your resources in English what will happen with these communities that let's say do not speak English well then you will be closing access to those communities to your platform or service and if you're an education platform or an organization whose goal is to reach as many people as possible people around the world then you will need to create that Global community of Learners who are interested in your platform who can find it helpful and who can spread the word about your resources now localization is a bit different from translation you might be surprised to know that this concept is actually broader the Cambridge Dictionary defines translation as the activity or process of changing the words of one language into the words in another language that have the same meaning so notice the key part of this definition translating is just changing the words while keeping the same meaning it's very helpful but a bit limited because when we translate something we want to say exactly the same thing in a different language however localization can go beyond that let's say that you have a file in English and you want to translate it into Spanish what do you do in that case well you translate it and you say the same thing in Spanish localization can go beyond just translating the words it can adapt the content better to another culture or country when you work with resources in English you will usually find like feet inches and those types of units for measurement for length but in Spanish we typically use meters and centimeters so converting that will be helpful for your users readers and viewers another example would be adapting the colors here let's say that we have a website for a particular population and we have this pinkish color but let's say that you've done some research and you decided to adapt the website into a different color that is also an example of localization because you are translating your content but you're also adapting it to fit the local culture better what are the types of resources that you can translate because we're talking about translating resources right when we talk about translation we usually think of a text document right like a Word document or something that has text on it and that is a very common application of localization but the term is even broader because you can localize or translate many different types of resources spreadsheets websites games even scripts and movies podcasts or videos with voiceovers or by translating their subtitles and or even localize in the subtitles if you would like to use local terminology when we create resources we will work with many different types of files and text combined with video is also very common in localization projects localization is not limited to text format we will focus on software localization during the course but I just want you to know that there are many different types of resources that you can translate and localize let's talk about common file formats that you can work with in a localization project this will be a very quick overview I promise you okay there are many different types of files but I carefully chose those that are most common for you okay first of all we have text files plain text files with the txt extension they do not store any images or non-text characters then we find comma separated values or CSV files here we are going to store text but the values are going to be separated by commas each line will represent a record in your data and this type of file is commonly used for data exchange the file extension is. CSV then we find HTML files they are mostly used for web devel velopment they have a file extension of HTML hypertext markup language and these types of files represent the structure and content of a web page they can be opened in a web browser Json files are also very common to store data Json stands for JavaScript object notation but it's actually independent from any programming language this type of file stores key value Pairs and it is commonly used for data exchange especially across the web after that we find markdown files to create formatted text it's a lightweight format with a specific syntax that is commonly used to write software documentation and blog post but its applications go even beyond that we also find portable object files portable object files are more specific for the localization process commonly used for writing multilingual systems get text is used by development engines like the Unreal Engine and XML is also very common extensible markup language these files are used to store share and reconstruct arbitrary data you can represent the data in an arbitrary way that fits your needs it's commonly used to exchange data over the internet and it's very important for localization in particular because many localization Frameworks use XML for example Android and we also find these types of files x l i FF files the file extension is exactly that xli i f f it this stands for XML localization interchange file format specific for localization it's an XML based format it's used to standardize the way localizable data can be passed between localization tools and we can also see this xlsx files and they are usually used used to store data in spreadsheets we also find Rex files well we can pronounce it like this or re SX files this is the file extension it's an XML resource file that is used bynet applications for storying resources that can be localized and this is something that you might be familiar with it's more standardized and it's not specific to localization it's PDF files it's a portable document format has a consistent format across software hardware and operating system so it's very helpful you will always see the same format when you open an PDF file independently of where you open it awesome and now you know more about the localization process and the files that you can work with let's talk a bit about continuous localization continuous localization involves localizing a product continuously as it is updated or expanded in an agile product development cycle it's often used to localize software products with the traditional localization process we would for example write a book then we would translate it and we would have the translated version right and that could happen once every few years when we make some updates or changes or we have a new addition but now with the software industry everything has to be faster because we're constantly updating the software and changing things in our user interface and in our content that will be a continuous process that is what continuous localization is all about continuously localizing the product as it is updated and in this case the product would be our platform great so now that you know exactly what localization is and how it is applied in the software industry we can start talking about some key local localization Concepts that you should know localization terminology you will come across these terms very often in the context of translation and localization here we have internationalization internationalization is defined by the Cambridge Dictionary as the action of becoming or making something become International in the context of localizing a software product it also involves adapting the user interface for working correctly with other languages and making sure that it is ready to be translated after that we find the term culturalized culturalized is defined by the maram Webster dictionary as deriving from or imposed or conditioned by culture so culture here plays a key role because every culture has different traditions and vocabulary culture can play a key role in how communities Embrace different products campaigns and platforms so understanding how to adapt them is very important to succeed and you will usually want to get the advice of someone who is very familiar with the culture that you're trying to Target pseudo localization is another very important term but let's start with the prefix pseudo the pseudo prefix is defined by the cambrid dictionary as pretended and not real pretended and that is exactly what pseudo localization is all about we have the prefix over here pseudo localization it's like a fake localization process the process of creating fake translations that act as placeholders for the real translations of a product or platform but right now you may be asking why would we ever need to use fake translations the answer is very curious we use these fake translations to check if our software is ready to handle multiple languages even before the translation process begins because remember that usually you will have a budget before you even start to work with that budget for the localization itself you can check if your software is ready to be localized with this process that is very curious I know and it's a very important step in this process that you may have not considered before this moment one specific example of this would be checking if a language that tends to have shorter or longer words works well with our current user interface because some words may be longer and some words may be shorter how does the UI adapt to those changes and will that work correctly if you check on Free Cams website and you try to change the language in this little icon at the top you will see all the options in the drop- down menu and after you click on them you can see that the user interface still works with different language even if they have different symbols if they're longer if they're shorter and that is also part of the pseudo localization process after that you translate the terms and you actually translate the platform but it's very important to make sure that the UI works correctly another example is making sure that the user interface is ready to handle right to left languages like this one some languages are written from left to right like Eng English or Spanish but other languages are written from right to left how is your user interface handling this is it prepared to handle that will you localize your product into this type of language those are common questions that you should ask yourself even before you start translating your software and pseudo localization can also be helpful to find any strings that may still be hardcoded in the project source files because when you start start translating your project you may need to move your strings to a specific resources file where you keep all the translatable strings but if you keep some strings that are still hardcoded they will not be translated and you will have that small issue in your user interface so pseudo localization can also be helpful to spot those cases that is the ultimate goal of pseudo localization checking if everything is ready to start translating awesome let's talk about machine translation machine translation is defined by Amazon web services as the process of using artificial intelligence to automatically translate text from one language to another without human involvement we will talk about this term in more detail during the course because the localization management platform that we will use to translate our resources has this feature which can save us a lot of time however these are usually not perfect and they will have to be checked before they are approved the process of generating machine translations is like this you upload your file to the platform of your choice and then the platform in their servers or in their infrastructure will start running a specific process with artificial intelligence here we have the little bot this is representing the artificial intelligence how cute once that process starts it will try to translate your resources automatically and you will have a translated file as a result however usually when you use machine translation the translations are not as accurate as they could be if a human translated the text so these translations will have to be checked however the process the automated process can save you and your team a lot of time because instead of writing all the text you will just be reviewing the translations and actually making the changes crowding the platform that we will be working with has this feature and I will show you how to create machine translations for your project great so now you know more about machine translation and now we can start diving into translation memory yes they are very similar in their acronyms we have Mt or TM and that is something that you should note they are very similar however they are very different please after we talk about these Concepts take a moment to understand their differences because we will see them very frequently and they can be confused translation memory is basically a database that stores segments of your resource these segments can be sentences paragraphs or sentence like units like headings titles or elements in a list that have previously been translated in order to Aid human translators so we will have like puzzle pieces the individual translations of sentences or different segments of our resources that we can combine automatically and review before we actually approve the translations but we will have them there in a database and we can make sure that we are being consistent in our translations because what happens when you upload a file or resource to a localization platform or tool usually the tool will divide your resource into many different segments that we call string when you see the word string in a localization platform that means a small segment of your resource that would be a file or a text file or any type of file that you uploaded to your platform when you upload your file to the platform the file will be divided into these strings right the string will be translated by your team or yourself if you are handling the translation process and after that you will have a translated string the translated string will be stored in a specific database of the service that you choose and that is how you gradually create your translation memory and then your translators can reuse the translations made by other translators to make sure that they are being consistent throughout the team that is great right so after that you can just take the string from the database and use it in your new transl ation it might not be exactly the same you might need to adapt it but it will save the save you or your translators a lot of time we have the database over here using the translation memory is helpful for saving time and for ensuring that you are being consistent while you translate the terminology and here we have what I was mentioning a few minutes ago the difference between TM and Mt these are acronyms that you will find very frequently in the localization tools of your choice we will find them frequently in crowding and you will find them often as acronyms so it's very important to differentiate them TM is translation memory it's the database and machine translation is Mt this is the automated process of creating the translations and this is the process of storing the translations in a database please take a moment to understand this difference because we will find them very frequently TM is translation memory and Mt is machine translation awesome and since we are mentioning artificial intelligence with machine translation that takes me to this concept of large language models llms you might have heard about them they are very popular right now with the rise of chat GPT and other similar models and chat Bots but what is an llm a large language model is a deep learning algorithm that can recognize summarize translate predict and generate content using very large data sets a large language model basically takes a huge data set and it learns from that data set it learns to recognize summarize translate predict and generate content based on the data set it was trained on so when you talk to for example Chad GPT and chat GPT gives you an answer to your PRP that is an answer generated automatically but it is based on the information or data set that the model was trained on that is exactly what powers these tools right now like chat GPT and other chat Bots that you can chat with to create content or to find answers to your questions these terms are fundamental if you're looking to dive into translation and localization and you will also find tools with artificial intelligence that are used exactly for this process because artificial intelligence is really changing how we translate and localize our resources the foundation of these models is called neural networks that work like the neurons in a brain generating different networks that process the data and generate a result so these are terminologies that you will find very often I just want you to be familiar with them before we find them in the platform another term that is super super super common and that you might be confused at first when you see them is numeronym numeronym are words that use numbers to represent an abbreviation for example in the localization context we find this L1 n that is a numeronym that represents the word localization the number 10 stands for the 10 letters that we have between the letter n and the letter N over here we have 10 letters since it's a very long word people tend to abbreviate it and they write the numeron name here but it's important to be familiar with this in this context and over here we have an even longer word which is internationalization and it's very common to abbreviate like this I 18 n the number 18 stands for the 18 letters between the letter I and the letter N at the end sometimes you may find the letter L over here in lowercase or in upper case but capitalizing the L is often helpful to distinguish it from the letter i that we have here because with certain fonts they can look very similar great so now that you're familiar with these Concepts that are fundamental for the localization process let's talk about prove reading when you translate something after that translation process comes the proof reading process the proof reading phase when you upload a resource to your platform form the resource will be divided into multiple strings right the strings will be translated and after they are translated they have to be approved by someone that process of approving the translations checking if everything is correct and also making changes if they find any inconsistencies or spelling mistakes or typos is called proof reading if they find anything if the proof readers find anything that shouldn't be there in the translations they can just modify it and make sure that you are providing the best translations possible for your users so we can Define improve reading as the process of checking updating and approving the translated strings translating and proove reading are two different stages of the localization process and we will look at these processes in more detail you will learn the steps involved and the different roles that team members can have to make sure that your content is localized correctly directly the role of proof reader is one of those key roles in the process and speaking of faces and roles let's talk about the different phases and roles of the localization process what steps are required for localizing a project where should you start here are the steps to help you answer those questions after you decide that you want to localize your platform or project there are many steps that you should follow or at least questions that you should consider first of all let's start with step number one defining the scope and the goals of your localization project before you start to localize any file basically it's important to take a moment to analyze these two aspects of your project the scope and the goals you should ask yourself questions like who is your target audience what are you trying to achieve how will you reach your goals do do you need to localize all your project files or just a few or do you have to create a new resources file to keep all your strings how will you localize the resources will you translate the resources yourself if you're bilingual or will you find a team to help you into how many languages would you like to localize your product what is your available budget to start with what is the timeline for your project are your goals realistic given your current budget if you're an organization will you involve your community in the translation process or will you hire a team to help you with that will you use automated tools like machine translation these questions are essential if you want to be successful defining clear and realistic goals can be very helpful for avoiding any unexpected challenges during the process you should write down your goals and make sure that you have a key outline of the steps that you will need to take to start execute and complete the localization process before things get more complicated planning from the start is the key to success now step two after you have all of that planned it's time to create the actual source files that will be localized source files is just a term that we use to refer to the files that you will localize the original files in your project having a clear initial idea of the complexity of a project will be helpful later on in terms of time management and budget required remember that planning is essential to save you time and resources if you have a very simple project then your course of action will be very different than if you have a very big project with many different thousands of millions of strings that you have to translate the complexity of the project will change your road map so Iz in that is also very helpful you should also evaluate how many times you will need to update the resources will you use a traditional translation process where you translate and then you just update the project every once in a while or will you localize your product continuously what type of tool do you need if you're going to localize it continuously those are questions that you should have answers for at this stage in the process and after that that step three is preparing your product for localization this is especially true for software products and this is very technology specific the tools that you use to internationalize a react app for example may be very different from the tools that you use for an Android application or an iOS application or even a game however the approaches and Concepts that you will use are essentially the same if you developing a web app application you will need to implement multilingual routing routing just means that you want to take your users into the specific part of your application where they can choose and see the content in their preferred languages to do this you have two options because it's very important for them to choose the right language and go to the right part of your website where they can access the resources in that specific language for that you will need to implement routing first of all you need to choose how you're going to represent that in the user interface and that is another UI consideration that you should be aware of but to actually implement this you have two main options you can either add the language code as a subdomain in the web application URL like this here we have for example the French subdomain for this website or you can also add the language code to the URL for example you can have it like this French language codes are also very important in the localization process and that is something that you might want to check as well when you start localizing your product there is a standard worldwide for how you can represent different languages with two or three characters like here we have French Spanish is es English is em and the type of abbreviation is also important for the actual implementation of this routing process these options are recommended for search engine optimization purposes so if you want to rank higher in search engines you should Implement multilingual routing with one of these options your software should also be able to handle and display any adapted numbers dates and currencies since localization may also involve adapting them into different formats for different different cultures let's say that you are creating an e-commerce app and you want to accept payments in dollars or Pounds or Euros you will need to adapt your user interface to show that specific symbol for the currency that the user has selected those are considerations that you should be aware of before you start the process and when you're making sure that everything works like you intended also date formats are very very important for example here we have a very different way to represent the same date if we are writing a specific date in the United States like this we can see that in the United States the day is written after the month but if we go to a different country like let's say Uruguay the day is written before the month in a date format that is the most commonly used format in in different cultures so this difference in how we actually represent the date is key to avoid any errors or misunderstandings in how the web app that you're developing or the platform that you're developing will be used by your users So to avoid any misunderstandings date formats is also super important to check another application is exactly what we were talking about here if you are accepting a payment in US Dollars you will have to write the symbol the dollar symbol but here if you are taking a payment in pounds from United Kingdom you will need to show this symbol in pounds how will you handle this in your user interface that is another very important aspect of internationalizing your web application another important aspect of preparing your software for translation is making sure that you are including the necessary context for your translators why because many internationalization tools just create the resource files where we keep all the strings but they created with only one key value pair for each piece of text they associate each piece of text in the source language in the original language to its corresponding translation but it's also very important to make sure that the resource files of your project include some contextual information of content and elements around them to choose the best translation possible try to include as much context as possible in your resources in your strings and finally another aspect is that your application should be able to handle pluralization correctly because different languages may have different numbers of plural forms some of these features may be available with the software development kit that you're using but you may need to add some of them using third-party libraries and that is always important to consider and check first however since it's very technology specific that is something that you will have to research about for your specific application great so that was step three internationalizing your software and getting everything ready if you analyze the scope of the project and you decide that you cannot complete it by yourself then it's time to assemble a team you may hire a team or if you are a nonprofit organization like free code Camp you can also use crowdsourcing to ask your community to help you with the translations you might be surprised by the number of general and kind members of your community who will be willing to help you achieve your goals with free go gam we are involving our community in a translation effort once you have your team or your community you can start to assign them roles and that is another key aspect of the localization process we will talk about Ro R specifically when we start diving into crowding but let's see a brief overview of these roles right now translators use the localization platform of your choice to translate the resources prove readers review edit and approve the translations developers work on more technical tasks they work on integrating the tools that you choose to automate the localization process as much as possible the developers can help you and your team to save a lot of time by automating tasks that are repetitive and that can be optimized and finally project managers coordinate the tasks of the project to make sure that the localization project moves forward smoothly as fast as possible awesome let's go to step five which is actually choosing the localization tools after you have your team and you know the roles that they're going to have you can start to choose localization tools choosing the right localization tool can be essential for reaching your goals in the world of localization there is a type of tool called localization management platform this type of system is designed to help you automate repetitive tasks with the goal of optimizing your team's workflow humans will still play a key role in the localization process but with the help of a translation management system or a localization management system they can reach their goals much faster usually these systems can be integrated with content Management Systems to import content automatically from other platforms such as blogging platforms for example let's say that you are creating a publication and you want to translate your articles if you have a localization management platform to work on you can usually integrate that with a Content man management system of your choice and keep your content translated by importing your resources then localizing them and exporting them as the translated versions with the proper Integrations translation Management Systems can also check if there're happening any changes in the source files and import new content automatically to start localizing it so that is a key aspect of data exchange between the localization management platform and content Management Systems a real world example of this process is right next to us free cam translates its resources on crowding when a file from free Cam's curriculum changes the new content is updated automatically in the system in crowding in our project so contributors can translate it and publish it very quickly automating this process can be very helpful especially for large organizations ations with different projects and files that's the advantage of using a localization management platform now it's time to translate the resources usually these platforms will divide the source content into what they call strings we already saw that concept right strings there are parts of the original text that you can translate save their translations and the software will take care of storing and combining them in the correct place in your file after you have those resources translated then it's time to prove rthm which is one of the most important phases of this process proof readers should check if the translations are accurate if there is a better way to adapt them to a culture or language they can check if there are typos or misspelled words and if the correct format is being used they can edit and approv their translated strings and approve the strings once everything is ready all those small details toils really count for the user experience so this step should be taken very seriously and after the resources and the translations have been Pro R it's time to export the localized resources if your project is small you have the option to do this manually but if your project is more complex you can choose to automate this process with different Integrations like we mentioned on your localization management system for example crowding the platform that we will be working with during the course has Integrations with different platforms including GitHub Google Drive Google Sheets Dropbox MailChimp WordPress and so on it has hundreds of Integrations that you can add to your project to synchronize the content automatically if your translations are ready and approved for example in the context of GitHub and you set up a GitHub integration the translated files will be updated automatically in your Project's repository you can even configure where the translated files will be stored that is the importance of Integrations and after you have everything set up after exporting that automatically or manually your project will be translated but you should still check for changes because projects and platforms can evolve over time files can change as you add new features and content and this is especially true in the context of free code cam because we add new content and update our existing curriculum on a regular basis awesome so now that we covered all the localization fundamentals we can start talking about crowding fundamentals for localization projects we will talk about crowding you will see how we are applying all of these Concepts in this particular tool so let's continue great welcome to the second part of the course now we will dive into crowding fundamentals so let's begin crowding is a localization management platform that can be described as a cloudbased solution that streamlines localization management for your team that is exactly how crowding defines the platform crowding can be used by individuals by teams or by organizations we will talk about the different features and some of these features even overlap between teams individuals and organizations we asked the founder of crowding how he would describe crowding in five words and this is what he said continuous localization for modern companies so that is what crowding is for you will be applying your knowledge of localization on this platform and you will even learn how to localize a website with crowding services and Integrations the main goal of crowding is to expand the potential of agile localization agile localization ization can be defined as a process in which localization is incorporated into an agile product development cycle a cycle in which a product is constantly being updated in an iterative approach so you launch your product you get feedback you update it based on the feedback and that process is repeated in a cycle continuously in this context the word agile is being used to describe the localization process the translations are continuously and updated as the product changes however constant updates also require constant management teamwork file uploads and downloads and exports platform deployments and so on the process could become very complicated very quickly if your team does not have the right tools but with a localization management platform like crowding you and your team can save time and accomplish your goals more efficiently that's the ultimate goal to localize the product as quickly as possible as it evolves that is the cycle that we are referring to here and that is exactly what free Camp does now let's talk about the advantages of crowding why you could choose crowding as your localization management tool you can connect with external Services through integration to automate part of your localization process you can store translations on cloud-based services and Grant access to team members and contributors from all around the world with different roles and permissions you you can also generate machine translations automatically when a resource is created and ask translators to check and edit them to save time your team can also check the quality and format of the translations with crowding quality assurance spellchecking and proof reading features and you can also generate reports create custom workflows assign roles and permissions invite new members and more so as you can see it's a platform that will make the localization process much easier for you and your team crowding has a free plan that is what we will be working with during the course sometimes we may see if some features that are specific for organizations since pram is a nonprofit organization we have a different plan the crowding offers for nonprofits but for individuals who want to start localizing their content for free all the essential features are included like unlimited public projects one private project 60,000 hosted words one integration with an external service features for translators efficiency and unlimited translators in the public projects that you can have that is a free plan for open-source projects and educational institutions like fre Cod Camp crowding has special licenses if you want to use crowding for an open- source project sign up for a free account set up your project and send the team the crowding team a request apply for an academic license if your project has educational purposes each granted license will include an unlimited number of projects strings and members so if you're an educational or open-source project or institution you can contact that team specifically for open source and educational projects let's talk about important terminology for working on crowding strings we talked about them but now let's define them formally strings are smaller segments of the original text from your file that can be translated and saved individually into all the translations already they are combined to generate the localized version of the resource that you need that is important to keep in mind we also find the term Source language The Source language is the language of the original resource for example free code com's Source language would be English since our curriculum and documentation are originally written in English we also find target language this is the language that our resources are translated into it's important to know the differences source and Target a project could have multiple Target languages okay like for goam or you could have only one target language if you only want to translate your resources into a specific language we take the source language and we translate it into the target language QA checks stand for quality assurance checks these are automated tests that check if the translations have the correct format and spelling crowding has many QA quality assurance features that can help your team find and fix potential errors and they're essential for the proof reading phase of the process QA stands for quality assurance that is very important and then we find the term glossery glossery is basically a database of important terms in your project with their corresponding meanings one is a glosser helpful well it gives your translators more context about a specific term and it helps them to choose the most accurate translations for a particular word great and then we go to screenshot a screenshot is a picture of what you can see on your computer screen at a particular moment in time if your localization management platform supports this you can upload screenshots and Associate them to specific strings to give your translators more context of where this the specific string appears on your platform or resource and after that we also find crowdsourcing we mentioned this before but now we're going to Define it formally crowd sourcing is a localization practice based on community cooperation it's basically engaging your community in the localization process fram's translation effort is an example of crowdsourcing we also find pre translation it is an automated technique to translate your project automatically using machine translation or translation memory when you upload your files remember that we talked about machine translation and translation memory before right we Define them individually but now we are applying both of them we are combining them to form a new term called pre-translation we can either take the translations from our existing translation memory or use machine translation to translate new terms but the important thing here is that it is an automated process and we also find Integrations crowding has hundreds of Integrations and we will cover some of them in the course they are connections that you can make between crowding or the localization management platform of your choice and other applications or Services you could have an integration with GitHub Google Drive Google Sheets and finally the last three terms that we're going to Define here are more technical in nature for developers but it's important that you even if you're not directly related to the development aspect of the process it's important that you understand what they are first we find web hooks web hooks are automated messages that an application or platform will send to another application or platform when specific events happen basically what happens with a web Hook is that you have two applications let's say that something happens in one of those applications when that happens you will be able to communicate between the platforms and through web hooks run a specific process to handle that event and finally we will talk about the concept of an API an API is an application programming interface this is a more Technical and development oriented term it's basically an intermediary software that allows two applications to communicate with each other by sending information following specific protocols and rules of course crowding has an API that can help you to integrate localization into your development process in a more automated way and those are all the most important Concepts that you will need to know to get started with crowding so let's start diving into crowding and let's go to their main website crowding dcom we will see how you can create a crowding account and we will start translating a file so I will see you in the next part of the course great so after this detailed but super important introduction into the fundamentals of localization now it's time to dive into practice and actually start working on crowding so let's see how you can create your crowding account the first step is to go to crowding dcom this is where you can access all the resourc sources tools and products of crowding crowding is an example of a localization management platform like we've been talking about we see continuous localization you're already familiar with this concept and you can see that crowding is mostly focused on software localization but we will also see examples of other resources like translating PDF resources to illustrate all the basic functionality and then you can apply these tools and principles to other types of resources like mobile apps games websites and other types of products after you land on crowding dcom you will see this green sign up button you click here and then you will be taken to the register page start your localization Journey with crowding and here you will see two different options crowding dcom which is selected by default and crowding Enterprise crowding decom is where you can create a personal crowding account for a small team and crowding Enterprise is more oriented towards organizations if you register for crowding Enterprise you can create a new organization like for example free code Camp is a nonprofit organization and crowding has special plans for nonprofits for open- Source projects and for educational projects and they can create in an organization for free and you can also try it for free for 30 days so let's see how you can register here forcing.com first of all you will need to write your email to sign up for a new account then you will have to enter a username a password and you will need to agree to the terms and conditions and your privacy policy you will also see a check by Cloud flare over here so let's do them I'm going to write my email over here and then I'm going to choose a username let's say Stefania demo after I do that I will need to write a password once I see that the password is strong I can still make it stronger let's just add and something else here okay great now it says that the password is secure secure should be your Target because it will be give you the highest protection against any type of unauthorized signin or someone using your password it's always prefer to reach this level of security so let's just agree to the terms and conditions and let's create our account if you're already a member and you're already registered for crowding you can click here to log Lo in okay so next time when you are logging into your account just click here and you will be able to enter your email and your password so let's create an account awesome this is the main dashboard or the main screen that you will see when you create your account you will see that you will need to verify your email to be able to reset your password receive email notifications and enhance security so let's just go to my email and let's confirm this before we actually start to dive into the different elements that we have here because crowding is very powerful if I go to my email over here I can see that I have an email from crowding excited to have you on board welcome Stefania demo thank you for trusting crowding with localization to secure your account and receive email updates about the activities in the projects you create and join please confirm your email by clicking the button below here I'm going to click on this link and I will open a new window and I will see this thank you for verifying your email and now I can just close this confirmation message and now I have a verified crowding account with a verified email so everything is ready to get started right now I am on a free account so we will see all the features that we have available if we go to crowding dcom again landing page and we go to pricing over here we can see that they have specific plans and what we're going to cover in the first part of the course is related to the free plan they have a free plan to start localizing your content for free with all the essential features for translators included unlimited public projects 60,000 hosted words one integration features for translator sufficiency and we will talk about many of these features in the course we also see one private project and that is great because we're going to work with one private project during the course but you can also create unlimited public projects and you will also be able to add unlimited translators in public projects just note that users on a free plan donate their translations to crowding translation memory remember that we talked about translation memory where the it's like a database of all the strings that have been translated in a project project that you can reuse well when you use the free plan you donate your translations to crowding translation memories so they can help others to reuse those translations and after you have your account already created let me show you how you can log into your account again if you sign out and then you want to log back in you just go to Crow in.com you click on login over here and in crow.com you just need to enter your email and this is the email that I used to register and this is my password I'm going to log in and now cing is asking me if I want to stay logged in they can remember your session so you wouldn't need to log in as often you can choose to do that or not it's definitely up to you you will see your username over here not now and voila we're back at the dashboard the main dashboard if you want to log out of your account at any moment you just need to click here on the profile on your profile image and go here to log out that will log you out of your account and then you can log back in awesome now you know how to create your account how to log out and how to log in again whenever you want to work with crowding great and now that you know how to create a personal account on crowning decom let's also check how you can sign up for a crowding Enterprise account in case you are representing an organization like free code Camp a nonprofit organization or another type of organization and you want to try crowding Enterprise to do that you would just need to click here on crowding Enterprise then enter your organization name this will be the URL of your organization on crowding so here you could have for example free goam demo. crowding docomo here your username and your password and agree to the terms and conditions and the privacy policy you will need to follow a similar process to verify your email like we did before and after that you will have your organization ready if you want to enter an existing organization just click here and you will be able to enter your organization's URL for the course we created a demo organization free codam course demo. crowding dcom and after you enter the URL you just click here on continue and you will be able to log in to the Enterprise with your email or username and your password you can also get a magic link to sign in without actually entering your email or password but let me show you how this works and what you would see once you're inside your crowding Enterprise account I am going to write my email and my password crowding is asking me if I want to stay logged in we can't remember your session so you wouldn't need to log in as often so we can choose to stay logged in or not right now you can choose either one of these options then you will see crowding logo and over here this is the main dashboard that you will see for a crowding Enterprise account you can see it is very similar to the dashboard that we had for the personal account with a few differences and we will be covering them during the course as well we will see how you can use crowding from the perspective of an organization or Enterprise great so let's continue now let's see how you can actually activate your free plan on crowding currently you can do this by going to crowding if you click here on pricing and you are logged into your account as I am here in my Stefania demo account you will see this plans for everyone and over here you can see the free plan you can also see your current account usage here you may find that you're using some Advanced features and if you don't see the option to upgrade to the free plan then it might be because of this and you may need to remove some Advanced features for that you may have used during the trial but to activ AC at the free plan you just go here and you should see this button but highlighted in green if you click on this button then you will be activating your free plan and you should see a confirmation message the confirmation message should be similar to this one get started with your free crowding plan create unlimited public projects and invite translation agencies or your community to translate remember you go to pricing then you click on this button which should be green to enable it if you don't see this button as an option then you may have some Advanced features enabled in this case you can have up to three file formats and that is included in the free plan but if you see other things here under this category this may be preventing you from getting your free account so make sure to remove them and then click on this button great so now let's see how you can customize your profile one of the first things that you might want to do after you create your crowding account is to customize your profile so let's do that after you create your crowding account you might see this short message and Survey that you will only see once after you create your account it says welcome to crowding we're glad to have you on board let us know you better so we can customize your experience how would you describe yourself here you can choose one of these options localization manager developer or translator Pro reader you can also specify how you would describe yourself here by writing a brief sentence and then you can click on submit or you can just close the short survey you can answer it or close it it's totally up to you so for now let's close it and now we can see the dashboard like you will see it after submitting the survey great so once we have that ready it's time to do one of the the first things that you will probably want to do after creating your crowding account which is customizing your profile to customize your profile you just need to go here and click on the small profile image which will have your initial there it's at the top right and then after you click on it choose settings from the drop-down menu like this in your settings you will see many different tabs but the first one is profile in your profile you will find many many many different settings over here but let's talk about them in detail first we find your profile picture you can drag a picture here or select a file from your file system you can also remove your current image this button will be enabled when you customize your image then we find general information like full name your first name and last name your username which you can just change whenever you need to of course if it's not already taken by another crowding user we also see our email this is not publicly visible the email will be used for account related notifications like password resets project activity updates and invitations to projects you can set up an additional login method to have an alternative for accessing your account and here we have an option to connect that to protect your account that is recommended after that you can also write your company your job title and pronouns he him she her or other or prefer not to say by default you will see this marked I will choose she her and after that you will see about me you can write a brief description of yourself and that will be shown publicly on your profile if you choose to make your profile public we also see crowding language English here you will see your time zone it might be customized you might might need to choose it from the drop- down menu and you can filter like for example Monto from youry we can see it over here if we need to choose it but you can customize this like you need to then the time format is either 24 hours or a.m. p.m. the time format that you will see in crowding and here we have a list of preferred Languages by default you will see English but you can also add other preferred languages let me show you how you can add Spanish for example if you write Spanish here you can filter the list to all the items list items that have the word Spanish I'm going to choose Spanish in general over here and after you check the check box you will see that language appearing over here and here you can Mark a language as native are you a native English speaker then this should be selected are you a native Spanish speaker then this should be selected okay you will see that it is saving your changes automatically over here and what happens if you just want to remove a language you select it by mistake or something like that and for some reason you want to delete it just click on it like this and you will delete it from the list awesome right you can also just search here but filtering the search list is always super helpful and the the options are very specific you can choose the language from a specific region or country so you have English from from Puerto Rico you have English from Japan you have English from India so it's very specific and you can customize this to fit your needs after that we also see a new Option appearance you can select how you want crowding to look select a single theme or sync it with your system automatically switching between day and night themes you can choose light theme dark theme this is the Dark theme let me show you this the Dark theme or you can make it match the current theme of your system in this case I have a light theme because I'm recording this during the day so it might be helpful for your eyes if you just C sink it to your system but for now let's just keep it in the light theme and finally privacy this is very important you can height the projects and it tabs from displaying publicly on your profile page if you check this checkbox you will make your profile private by default it's not private so you should be aware of this and go here immediately if you don't want your projects and activity to be public and finally the last option is deleting your account but you will see a shiny red button over here because deleting an account will immediately delete all the projects created under your account and all the associated data deleted accounts cannot be restored not even by the team apparently based on this message so be completely sure that this is what you want to do when you press that button delete account awesome now you know how to customize your profile here in your account settings you will see other tabs like account notifications API security log o off and and beta features let's just have a quick dive into these options so you can see them your account tab has the the option to change your password you can also have your security Keys over here which are physical devices that add an extra layer of security to your online accounts you can register your security key here and you can also enable two Factor authentication to increase your account's security you can click here on enable to enable it and you can also create create SSO connections manage the accounts you have linked to your crowding account these connections allow you to log into crowding with a single click and remember that you have the option to log in with your Google account your Facebook account GitHub X and gitlab account and here you see a list of devices that have logged into to your crowding account and you can revoke any sessions that you do not recognize so this is for your own protection and it's a great feature you can also choose to revoke all the sessions if you need to after that we have notifications where you can customize all your notifications slack integration product updates H notifications you can set up a custom channel for the notifications and these are your Global notification settings you can send notifications for users and roles Integrations new strings language progress API integrative vendors content issues mentions tasks messages discussions and API notification you can choose whether to send the notifications in app or by email and if you just deselect this you will be deselecting all of them at once but if you enable this you will be enabling all of them and you can also disable that by email as well or you can enable and disable them individually that is great you can customize it to fit your needs and we will talk about these features in detail during the course after that we also find the API because crowding has an API that developers can work with the crowding API version two is a full-featured restful API that helps you integrate localization into your development process you can create personal access tokens for authorization when working with the crowning API the command line interface some of the Integrations and plugins here is where you can create a new token if you need to you have your personal account security logs all the login events and all the events related to your your account you also have o off applications you can create o off applications to access the crowding API and here we have some beta features that you can choose to enable if you would like to try them but they are experimental and still in developments so they are not quite ready for production they may change break or disappear at any time you can enable this if you would like to participate on that beta features testing process awesome now you know how to customize your profile and we talked about your account settings so let's start diving into the Practical aspects of croing and let's create a project in the next part we will create our first project in crowding great so now that you know how to customize your profile let's create a project we will do that from our profile page if you're in a different part of the platform like your account settings you can go back to your profile page by clicking on this small profile image at the top right and then clicking on your username here the first item that you can see in the drop-down menu yes you can do that or you can also click here and go to home this is your homepage this is where you will see all your projects you can explore other projects you will also see your activity your account activity over here in the activity tab to create a a project you have two different options you can either click here on the green create project button or you can click here on this gray button they are both equivalent and they both take you to exactly the same page so let's click on the green button since this is usually what we see first and that will take us to a page where we can fill fill in all the necessary information for our project like our project name our project address here this is the URL where we can find our project it must be unique if your project has multiple words and you write the those words here in the project name they will be connected here so let's see this free code Camp project demo you can see that as I type these words the project address is filled in automatically and the words are connected by a hyphen over here that is very helpful because URLs cannot have spaces so they have to be connected by hyphens and this URL has to be unique if this URL is not available on crowding then you will see a warning and you will need to add some variation to the URL you also see project privacy settings if the project is public they will be visible to everyone you can restrict access to specific languages after the project is created that is for a public project but by default the project will be private if you don't change this option a private project is visible only to the invited project members and we will see how you can invite project members in the part of the course where we talk about teams and collaboration for now let's keep our project private since we have a free account and the free account includes one private project after that we find the source language remember that we talked about the source language The Source language will be English we're going to translate a PDF file to show you all the basic features for now all the basic features and the PDF that we will be uploading will be in English so that will be our source language if you click here you will see a list with all the available Source languages that you can choose from you have very specific options so let's say that you want to filter the list by Spanish you can filter the list by Spanish and you also see Spanish specific to each one of these countries or you can also choose Spanish in general so that is great you can filter the list and after you choose the source language you will need to choose the target languages you can have one target language or multiple Target languages and crowding gives you that option to customize your project to fit your needs you can choose as many as you need you just need to check their check boxes and they will be added so let's let's say that we we want to create a demo project with a target language in of Spanish Japanese Italian Portuguese and we also want Portuguese Brazilian and Bengali as well let's just choose these languages to show you that you can select multiple Target languages and you will see them added to this list if you want to remove all the languages at once you can clear the list here by clicking on this trash can or you can also remove them individually by clicking on the language let's just remove Spanish and that will remove it we can add it again if we need to no worries you can also sort them alphabetically or sort them by popularity that is very helpful and it will also apply to your search another great option that you can use is that you can prefill the list with the top to 30 languages that are most popular on crowding without having to select them manually so if you're starting a project and you want to use crowd sourcing and you want to start translating your project to the most popular languages this option will save you some time you can also create custom languages as well that is another amazing feature that we have here on crowding if we click here on custom languages we will see the option to add a dialect initially you will not see anything because nothing to there is nothing to display we don't have a custom language but if you do need to create a custom language you can click on ADD and then you will be taken to this dialogue where you can write the name of the language it choose if it is a specific dialect of another language you can see the the language code on crowding how that language will be described with a a specific code you can also write a three letters code and a local code an example would be like English but from Great Britain if it's very specific to a region after that you have text Direction because some languages are written from left to right while some of them are written from right to left so you can choose the text direction for the custom language and you can also select the plural form different languages have different plural forms you can read more about adding custom languages if you click here and you will be taken to crowding documentation where you can learn more about these settings but it's great to know that this option is available let's check our settings before we create the project project name free cam project demo project address is free cam project demo it will be a private project and we can change this later on if we need to but for now we're going to make it private we also have the source language in English and we're going to choose six Target languages great so after you have all that information ready to create the project just click here on create project or if you decide that you don't want to create the project just click here on ccel and now let's just create the project we click here and we see project created successfully over here great if you choose to create a private project when we create our first project we will see this message this is the current state of crowding at the moment it might have changed at the time when you are taking the course but right now we see this message of the trial expiring in 14 days but this is a trial of the premium features in crowding after the trial expires we should go back to a free account with the features that we saw one private project unlimited public projects and a maximum number of hosted Words which was 60 60,000 words so you will still keep your free account after the trial expires great so now we have our first project in crowding free goam project demo of course it will be empty at first but don't worry we will take care of this in just a moment we will be uploading a file and we will start translating but first let's have a quick tour of this project and the different tabs that we have over here and how you can find all the information you need for your project we will do that in the next part of the course so I will see you there awesome let's have a quick tour of the project so you know everything that we have available here first we can see the name of the project over here next to our username here we can see the privacy of the project it's private otherwise you will see public here you can create one private project and unlimited public projects with a free account on crowding you can also see the project over here on this sidebar where you can find a list of all your projects and you also see the option to create a new project from here that is great because it is available here you don't have to go to your home again once you have this on the sidebar if you need to create a new project after that we find several different tabs let's go from left to right we start with the dashboard tab in the dashboard tab you can find all these elements let's let's talk about them first you have a filter to filter the list of languages that you chose here you can see all the target languages that you selected when you created your project we see Bengali Italian Japanese Portuguese Portuguese Brazilian I also selected this to show you that we will have them as independent like languages on the dashboard and we also see Spanish over here for each language you will have a list item with specific information in this bar you will see the progress of that language you will see them being filled with green and blue bars and they represent the percentage of the strings that have been translated and approved for that specific language right now if we click on them we see that there are no files to display but we will take care of that when we upload a file next to them we also see the details of the project we see the source language English project members one right now because it's only me words to translate zero the project was created 2 seconds ago yes that was really fast and the last activity was 8 minutes ago the quality assurance checks that we talked about in the slides remember when we talked about important terminology for crowding we saw quality assurance checks right now they say that there are no issues of course we have no files so there are no issues and we see the managers the project manager is currently my account I am the project owner and we will see how you can assign different roles to different team members in the course and you can also contact me here on this link so that is very helpful as well here we see a tool to search this will filter the list of languages so like let's say that I want to find Spanish here I just write Spanish and it will filter the list to show me only Spanish or other variations of Spanish local variations if I write Portuguese I see Portuguese and Portuguese brasilian this is especially helpful for many Target languages for example free code cam has more than 30 languages more than 30 Target languages available for translation so four are organization's project this feature can be helpful we can also choose how to sort the languages sort them by default order alpha numeric order completed first or uncompleted first if we want to see all the completed languages first we choose this option all the languages that still need some work first then we choose this option or just sort them alphabetically Alpha numerically and here we can see them in a different present instead of showing them as a list like this we can also choose to show them like in a grid which is a more graphical option I personally like this a lot and I like the fact that they include specific Flags or the language code it's very visual so you can choose the option that you like the most here we also find pre- transation remember what we talked about pre- transation yes we find it here pre- transation can be done done via TM or via Mt remember the difference between these acronyms yes everything that we saw in the previous section with the slides is coming back to us we see TM which is translation memory the database of everything that we have translated before we could use that for the pre- transation or we could do that via the machine translation which is like an automated way to translate your files and then of course you would need to check the automated translations but you can choose which method to use for the pre- transation and here you can go to the editor to start translating but right now we don't have anything to translate so let's not go there yet and you also have the option here to enable notifications Global mentions only or you can also mute project these are the different settings you can experiment with them and see what works best for you that is what we have on the Das dashboard tab for the sources tab we have another set of tools this is where you will see a list of all the files that you can translate right now we don't have any files to translate so we can use one of the following options to upload our source files we have the option to upload files from the our device they also support zip archive so that is also helpful in case you have a zip file you can use sample files from crowding to explore explore how the platform works we can set up an integration with the repository or other supported systems as well and we can invite developers to help us with the project setup so we have everything we need here we're going to upload our file from our device in just a moment we can see our files or we can also check our strings right now we don't have anything to display we will have them when we upload the file we can also group our files into folders here we can see that we can create a new folder and we can create a new version branch and we can add a file this is equivalent to clicking here to upload file okay and we can create strings Vault or set up an integration like we have over here so we just have multiple buttons to do exactly the same but they are both helpful and here we also have the trash can icon in case we would like to delete some of them great then we go to translations the translations tab in translations we have the option to upload existing translations and we will talk about that in just a moment we can also download our translations as a zip file if we select a language one of our Target languages then we can just build them and download them as a zip file we can also create Target file bundles but this is a bit more advanced and we can also set up over theair content delivery with Amazon web services and other services that you can use for this but this is a little bit beyond the scope of the course you can always learn more about this these features on the crowding knowledge base in the screenshots tab we have the option to upload screenshots to provide translators with more context this way you can significantly improve the quality of the translations because for example if you're translating a website it you have some strings on your website you have some text you might want to take a screenshot of the specific part of the website where the strings are are displayed and that will give them some context to provide the best translations possible here we have the tasks tab where we will see tasks that we have created for the project we will talk about tasks when we reach the part on teams and collaboration tasks are very helpful in crowding for especially for project manager and for making sure that the project runs smoothly here we can also find the members tab right now I am the only member of this project but if you are planning to add multiple members here you will see a list of members you can search members by name or username you can filter them by rols you can assign them different roles of course and we will also talk about that but you can filter them here and you can filter them by language as well if you select one or more members of this list you can also choose to contact them or uh you can also delete them in this case I am the owner so it cannot be deleted but you can also delete them and you can invite members another key thing that you might miss because it's right here to the right very apart from the filters is this option if you appli some filter like this and you just want to clear it you can click here on clear filter and all the filters will be cleared and if you have multiple Pages you can just go through them here on these arrows after that we find Integrations this is where we can add Integrations to our project and we can filter them reports will show us reports of our project we will also see them in more detail but right now we don't have enough data because we do not have any files but in the projects you can check the project status the translation cost Top members as well Top members of your project and here here we can find the activity the activity for this project right now is just one item I created this project and we can filter that by specific types of activities like project builds project setting updates Source strings updates translation activity comments and issues we can also filter the activity by languages for example we could check for Source string updates in Italian let's say and we could also filter the activity by user if you would like to check the activity of a specific user in the project and if you need to clear the filters you always have that option here great we just have three more tabs one key aspect of teamwork that will make your project run smoothly is communication and that is what discussions are for here we can create new discussions with this button and we can mark them as open or closed and filter them by language or by author the discussions are very helpful to discuss or talk about anything related to the project that you think should have input or feedback from multiple team members you can do all of that within crowding you don't need to go to an external tool to do that to create a new discussion you just click here on new topic and then you write the name of that topic the title you choose the language related to the topic or you might choose not to specify the name if the topic is not related to a specific language and then you just ask a question or start a conversation here and this supports styling with markdown so you can use markdown you can add bold text you can add headers and that is very helpful to format your text appropriately you can write it here and if you need to preview it you can preview it let me just write this something like heading one and in markdown we create a heading with a hash symbol and if you want to preview it with the final format you can just preview it over here great after that you just create the topic and you will see it in your list of discussions and over here we have some additional tools like the command line tool the crowding API web hooks we talked about web hooks which are like messages that are warnings that we and when something happens in an application that means setting up a notification for key events in your project and you can also translate your web application with a realtime translation preview with crowding in context and finally we reach the project settings talking about the project settings let's dive into the settings that you can customize for your project there are many settings and we will go through them in detail so we will do that in the next part of the course so I will see you there let's dive into the settings and talking about project settings let's dive into the settings that you can customize for your project here we have our free code cam project demo you will find different categories of project settings including General privacy and collaboration languages quality assurance checks translation memories glossaries and different options for your content like importing exporting labels parser configuration and file processors some of these settings are more advanced but let's have a general overview of what you can customize first of all by default you will be in the general settings the general settings include the project name the public description of your project and branding for example you can set a custom domain for your project to get an access to the custom domain name you need to create a cname DNS record in your hosting service and only the https protocol is loone here you also have the option to invite a developer if the developer is the one who is going to be creating the custom domain you can also set a Project logo by uploading an image with these formats it can be a JPEG image a PNG image or a GF file and after branding we find the batches you can choose to display batches to share the localization progress of this project via a batch image and this is a preview of the batches you can embed batches on your website or read me so your app fans can see the localization progress and help you with translations currently the batches are disabled okay but this is a preview and you would see the percentage of the progress of your project over here and the last option that you can see in the general settings is the option to delete a pro project but be careful with this because deleting the project will permanently delete all the resources associated with the project including any uploaded files translations approvals and Etc deleted projects cannot be restored so be really careful with this if you choose to click on this button this is for the general settings then we find privacy and collaboration settings you can set the Project's visibility like making the project public or private a public project is visible to everyone you can restrict access to specific languages after the project is created and if you choose to make your project private it will be visible only to the invited project members and we will see how you can send those invitations in just a moment when we reach the part on team and collaborations after that you can also see some privacy settings this was the visibility now we go to privacy you can choose to Ena or disable all of these options like task based Access Control if you want to allow offline translation this is selected by default if you want to allow proof readers to access hidden strings if you also want to allow project members to manage glossery terms or show machine translation suggestions connected with the machine translation engines that you choose they will appear as suggestions in the editor if you have this option enabled and the last category here are notifications notifications for translators when there are new strings to be translated if you want to notify project managers and developers about new strings and if you want to notify project managers and developers when a language translation or proof reading phase has been completed those are important notifications you can just enable them or disable them by clicking here on their check box great that is for privacy and collaboration now let's go to translation settings first we find languages initially when we created the project we chose a source language and a target language then here we can change that and even add custom language codes if we change the source language that might cause a plural form mismatch according to crowding for imported strings if your new source language differs from the initial one in plural forms it's recom recommended to update the source files accordingly okay so that is recommended you can choose it from this list that you have over here it's quite comprehensive you will find the language and specific local variations of that language for specific countries you can also change the list of Target languages remember that we selected six languages here right you can just delete a language if you need to and save your changes by clicking here or you can also add new Languages by selecting them over here it's basically the same component or element that we saw when we created the project and if you just want to remove all the target languages you can click here awesome now that you know how to change these languages let's go to QA checks remember that QA checks automatically highlight all the possible mistakes in the translations prior to their approval they're very helpful because detected issues will appear in prove reading mode and your proof readers can check them and fix them if necessary this is where you can customize what you want to check automatically you can check for empty translations length issues tax mismatch spaces mismatch barbles mismatch punctuation character case special characters basically anything that can go wrong when you try to translate a string any typos any mistakes like incorrect translation issues or spelling or typos or also making sure that you use the terminology consistently with the correct translation for specific glossery terms you can enable or disable each one of these QA checks for your project and then you just need to click on save to save your changes and over here next to each one of these checks you will see the type of warning or error that you will get for these issues that are detected in your project for example if the translation exceeds any predefined length limits you will see an error here but you can also change that to a warning error would be the highest priority for those issues and warning would be something a little bit of a lower priority awesome and you can also disable all QA checks simply by clicking here this is a faster way to do that if you just want to disable or enable all the quality assurance checks this one will not be selected by default you need to select it and enable it manually by clicking here okay and after that you just save your changes and voila here we have them right great they are very helpful and another thing that is super helpful is a translation memory in the translation memory settings you can enable auto substitution this feature substitutes the non-translatable elements like a tax or HTML entities or placeholders in Translation suggested by translation memory by the ones that are used in The Source text this improves translation memory suggestions and allows pre- transations translation memory suggestions for dialects you can also enable that show the primary language translation memory suggestion for dialects if there are no dialect specific ones so if you have a specific language and then you're working with a dialect if you don't have a specific suggestion for that dialect you will also see the translation suggestions for the general or primary language that is very helpful you can use Global translation memory as well to give translators access to the crowding Global translation memory which is a huge fault of existing translations contributed by previous projects remember that with a free account you are donating your translations to crowding a global translation memory so that is great you can also reuse what other people have translated before when this setting is enabled all translations made in your project are automatically committed to the crowding Global translation memory you can also choose the translation Memory Match context type this is these are a little bit more advanced and you might want to take some time to dive deeper into them we're just having a quick overview here so let's just check these ones at the bottom we see some penalties penalties are basically used to decrease translation memory suggestion match percentage based on specific conditions so with translation memory you will see suggestions for a translation but some translations will have a higher priority and some translations will have a lower priority based on how well they match the original phrase or string you can also assign some penalties to that match percentage based B on these criteria that is a more advanced feature but you can also change that in the settings and you can change the assigned translation memories for your project this is something that you might want to use more often and it basically allows you to change the translation memories that you will be using in your project by default you will have your Project's translation memory based on what you have translated for the source files of your project but if you have other translation memories for other projects in your account you can also choose to use that for another project and share them across your projects that is super helpful and you can just select which ones you would like to assign to your current project in the settings and you can also assign them priorities so you will use the suggested translations from the translation memory with the highest priority we will talk more about translation memories more specifically during the course but for now just know that the this is where you can customize everything related to translation memories and over here you can also find glossaries remember that a glossery was a set of terminologies with their definitions a glossery term and this is where you can manage your glossies for your projects in the settings if you had multiple glossies you can choose them or select them from this list you would have several glossies and you can choose which ones will be used for your current project like this this one is Select Ed by default because it's your own projects glossery we're in that project right now but if we have multiple projects with multiple glossies we could reuse them or assign them to different projects and that is great because we will be saving time awesome and now let's just check the last category which is content content settings these are the settings for importing and exporting files and strings and source files they basically help you with your workflow like working with source strings how you want to handle duplicate strings like you can save time by translating all duplicates with the same translation and hiding these instances from translators but this can affect accuracy okay so you can choose what to do with duplicate strings you can also configure how you want crowding to count words in your project like automatically if you want to consider the TX or if you want to skip the TX once you change the option only the newly uploaded words will be counted according to the new settings and if you change this option the new setting that you choose will be saved automatically okay because right here you can see that we don't have a save button but your changes will be saved automatically if I let's say change this to count TX and then I go to another category and I go back you can see that the change was saved automatically even though we don't have a save button right here just to give you that tip and then once we we go to export we can also see that we can save context information in the files we can skip any untranslated strings if we want to this is not enabled by default so we can enable it we can skip on translated files once we are exporting our project we can export only approved translations and we can also automatically fill in Regional dialects from the primary language so for example untranslated strings in Regional dialects like for example Argentine Spanish will automatically include translations completed in the primary language for example Spanish and now we go to labels labels are very helpful because they can add context to your strings and organize them by different topics they can also be useful when you want to search for specific strings because you can filter strings by their labels you can add the labels to your strings here in the settings in the labels category let's see if you want to add a label you just click here on ADD label you write the title of your new label and you click on Save and then you will be able to add the label to your strings let's just check what happens demo label and let's save this now I see my new label over here and I can edit it or delete it if I edit the label I can just change its title and if I want to delete it I can delete it over here delete Del the label yes deleted and I don't see it here anymore but when I am using the editor I can assign that label to a specific string and that can be helpful and finally the last two options are a bit more advanced they are parser configuration to configure how you want crowding to Import and Export selected file types depending on your needs like this let's say for example that your file is in this format let's say that we have a a markdown file over here we see these extensions for a markdown file this would be the set of extensions and the API type here would be this for the markdown file MD you can edit this to change your parser settings you can see markdown parser settings you can enable content segmentation use custom segmentation rules exclude code blocks and these options are more advanced okay they are a bit beyond the scope of this course which is covering like localization fundamentals but I do encourage you to dive deeper into this because it can be very helpful as well as file processors which allow you to customize processing for the supported file formats great these are all the settings that you can customize for your project in crowding so you should have a good idea of what you can customize for your project in the next section we will see a quick review of how you can delete a project in crowding I will see you there and then we will actually start to upload files to our crowding project and we will start translating with the translation editor I will see you there great work now you know how to customize your project settings but let's quickly review how you can delete a project in case you ever need to do this in the future here we just go to settings then general which is selected by default and we go here to the bottom where we see delete project if you click on this button you will be deleting the project permanently and you will be deleting all the resources associated with the project including any uploaded files translations approvals Etc and this cannot be undone deleted projects cannot be restored so be 100% sure please when you click on this button now it's time to start working with our files and so for that we will upload a file to our crowding project I will show you how to do that manually for now since we're covering the basics we will upload a sample PDF file with text and images and you will see how crowding extracts the strings and how we can translate the strings in their translation editor so I will see you there in just a moment so let's continue now we're in the settings tab right but we need to go to the sources tab to upload our files in the sources tab you will see this of course it's empty because currently we have no files to translate but we can use one of these options to upload the source files we can choose to upload files we can also upload our files as Z if we need to upload multiple files we can use crowding sample files and that is helpful to explore crowding works if you want to use these samples at first you can also set up the integration with your repository we will talk about Integrations when we reach the part of the course for developers because you can integrate crowding with your for example GitHub repository with the GitHub integration and import your source files automatically with your GitHub integration right now we're going to focus on how you can do this manually since we're covering the basics and you can also invite a developer to help you with the project setup with this option right now we will be uploading a PDF file a PDF file with with some text that I took from a free code cam article this will be our demo file I will use this to illustrate how crowding takes a file extracts the strings and it can also work with files that contain images so I think this will be a nice example let's upload the file by clicking here you can also choose to add a file by clicking on this button and these are more advanced options okay so basically you would be clicking on ADD file or upload files and you can also create a folder here let's upload a file welcome to Free code cam I'm going to open this file and you can see how it's being uploaded yay so if it might take a few seconds to change while it's being uploaded and processed because remember that crowding has to extract the strings and divide the text into multiple strings and you will see this blue progress bar here you will need to wait until you see a confirmation that your file has been uploaded if you click here or you go to any of these tabs you based on my personal experience right now you will lose the progress that you have for that file so just stay there until the file has been uploaded and voila over here we can see that the blue bar that we had here while we were uploading the file now changed into different options that we have here for our file and we can also see that we uploaded a PDF file but that was converted into a different file format doc X which is like the word format that we use for Word files that is something that will happen when you upload certain types of files crowding will convert them into another format to make it easier for the platform to process the individual strings but when you export them you can choose how you want to export them and over here we see the number of strings that we can translate this particular file has 22 strings with a total of 212 words if you hover over this number you will see the number of words and you can also see the history of file updates here if you click on the option in the revision column you can also choose to update the file by uploading a new version that can be helpful if the file has been modified somehow and you can assign priority for example here we have that the file has a normal priority what happens if I click here well I make it a high priority file it will have a high priority if not it will have a low priority if I click on it again and if I just click on it a third time I will go back to a normal priority that is helpful to categorize files by their translations priority for example you may choose to translate the files of your landing page before you actually translate files deeper in your website or your platform and over here we can see a drop- down menu when you click on the ellipses and we see these options we see add file we see new folder we see create strings fold settings download Source rename and delete if you click on rename you can just rename your file here I could just change it and if I click anywhere outside of the name I save those changes and if I need to delete the file I just click on delete if I click on settings I will see the file settings and that is interesting this is not the project settings this is the file settings let's dive deeper into these settings file details this is the title as it appears to translators you can show descriptive file titles to translators for example you can just assign a more readable name like this one instead of the original file name that may be abbreviated or written in a specific format in your application this file title is only shown in the user interface in crowding and doesn't rename the actual file so when you export your translated files you will still get the original name and here we can see different settings about the resulting file after translation export this is the file name or full path in the resulting archive using the placeholders listed below for example the source file can be resources. Rex but before integration into an application it should be named like this so you can use these placeholders like the language the twetter code the local and you can use the placeholders in the name of the file like this and that value like the language will be replaced in the name of the file that can be helpful to automate the process especially like in software projects where you need to have different names for your files in different languages you can just add the two letters code to differentiate them and use them in your file path that is very helpful this is an example for Android projects like this you can see how it's using the placeholder Android code and the original file name here and other types of projects you can also change the parser configuration like clean taex aggressively translate hyperlink URLs this is also helpful if you are localizing the URLs as well you can translate hidden text translate hidden rows and columns in spread sheets and for slides you can import hidden slides and import the nodes in your slides which can also be helpful if you added some extra notes to a presentation and you can enable content segmentation and use custom segmentation rules these are more advanced options but in the languages tab you can also change file Target languages because you can customize this for each file as well let's say that you don't want to translate a specific file into Spanish you can just disable this for that file and click save and you will not see that file in the Spanish category of your project you can also disable all languages if you don't want to translate it at all or you can select specific languages like this for now let's keep all languages if we read this warning we see that it is recommended not to hide duplicates in the project when disabling languages otherwise duplicate strings in this file may not be available for translation and finally context in this tab you can add any contextual information that will help translators to understand the source text meaning context will be visible for translators in the editor and it also ports marked down and that will be helpful for your translators great so after you configure all of that you can just click save or cancel or just click on this x here to go back and now you know what the file is about we uploaded the file and now if you need to upload a second file you can just click here on ADD file and you will see the option to choose a file from your file system this is how you can upload a file manually remember that we have an option to automate this through Crow Integrations specifically the GitHub integration is one of the most popular ones because you can automatically synchronize the files of your project when you add new strings that have to be translated in crowding that is similar to what we do at free code camp with our open source project so now that you know how to upload your files to crowding manually let's see how you and your team can actually start translating we have the file in crowding so how do we actually translate it that is what we will see in the next part part of the course I will see you there once your file is uploaded it's time to start translating you may start translating the file yourself if you're going to complete the task yourself or you can ask your team to start working on the translations you can assign specific files to your translators and prove readers with the tasks feature that we will talk about when we cover crowding for teams organizations they're very helpful and you can find them here on this tab but for now let's assume that you're translating the files yourself so you can also be familiar with the user interface to start you just need to go to the dashboard tab where you will find all your target languages then you need to select the target language that you will be translating from this list I will choose Spanish for this demo and after I click on Spanish I see the the list of files for the project this is the original source file that we uploaded in the sources tab you will see this file regardless of the language where you click on right because if we go back to sources and we check the file settings like this we will see this languages and right now we have all the target languages selected that is why we see this file in all the languages but let's say that we just don't want to translate this file into Spanish we can save these settings file updated we go back to dashboard and now we see that there are no files to translate you can also do this and choose which languages should be the target languages for specific files you even have that granularity in the settings and permissions great so let's add Spanish again and now let's go back to Spanish and here we have our file we see that we haven't started translating or approving our strings we have 20 and 12 words as to do for translations and approvals so let's start that process by clicking on the name of the file you can also filter files here if you have multiple files you have a very long list of files you can just filter them right here to start translating the file you just click on the name in the corresponding language and that will take you to the heart and soul of crowding the translation editor which is an amazing tool that you will be using daily if you're going to work on crowding when you enter the translation editor you will see these tips like how to view which strings require translations all the source strings are listed on the left side part and colors that know their status and icons next to them the note comments or issues created for these strings you can see if strings are untranslated partially translated or translated and the same statuses apply for approval partially approved approved and hidden if you see a string in grade that is a hidden string you can also collaborate on translations in real time use context to make relevant translation remember that we were able to add some context in the file settings that is helpful for translators and we can preview our translated files we can also make translations from any device because crowding has supported mobile view for the translation editor so you can translate on the go and we also have some different views we will see them in action when we start translating this file we have the sidebyside view and we also have another view that is very helpful to translate multiple languages great now that you know on your way around crowding translation editor you can start making translations you can also check their knowledge base or chat with the team so we're going to close this and now we are in the translations editor remember that when you upload a file crowding takes the text from that file and divides it into Strings which are like the basic units of a localization process this process may require certain format conventions based on the type of file that you are uploading in this case we uploaded a PDF file but we are working with a doc x file which is like a word file and therefore we can work with a strings individually another way here in the translation editor we can see the main layout this is called the comfortable mode in the crowding translation editor we see that we have four main sections or areas we have the left side bar over here we have the Middle top area over here we have the middle bottom area over here and we have the right sidebar let's see what each one of them does and what it has let's start with the left sidebar over here and let's go from left to right the left sidebar shows you all the strings in your file and a preview of your source file you can also enable if you want to see this text translated once you save and approve your strings that is helpful to see a preview of the file in the target language you will find helpful tools for the translation process here at the top you can search for something in a file let's say that I want to find the word certification in my file what do I do I just write it here and I press enter and that will take me to Strings that have the word certification you can see that this string has the word certification this string also has the word certification I'm pressing enter here to jump from the current string to a new one and over here we also see certification but certifications but that also matches our search and if we just continue pressing enter we will go back in a cycle that is helpful to find strings that have a specific term or something that you want to find in a particular file then we also find this tool to load the basic list view if you click on this button the preview will change to this this is a preview of all the strings in the file without actually previewing the file with the original layout and the images it's basically like a simplified version where you can only see the text that crowding extracted from the file you can go back to the previous View by clicking here in the list icon then we find this which is to highlight untranslated translated and approved strings because you can see that the strings here are highlighted in red because they are not translated yet if we just disable this option we see the file as it was presented originally without any highlighted strings we can enable or disable this that is very helpful too you will see different colors for strings with different status then as the third option here we see show the translation preview what this does is that when you enter your translation over here for a particular string like this you click on it you will see the string here and then you will write your translation over here you will see the preview of that translation being replaced here automatically so you will have a preview of your file in the target language of your choice that can be helpful but you can also disable it here if you need to and then we also find a scale toggle option and an option to add a string okay now that you're more familiar with this left sidebar let's go to the Middle top area the Middle top area is where you can translate a string you just need to select it from the left sidebar and the string will appear here will be replaced here in this area where it says Source string like this just click on it and it is replaced here automatically then you can enter your translation over here let's say that we translate it like this Al ccul the free code Camp let's translate it like this let's say here we have the translation and this is what I was mentioning just a few seconds ago that we have a preview of the translation that we just wrote here if we want to disable this and just see the original string in the file preview we can disable this option or enable it to see the preview again like this if you toggle this option and you disable it and you enable it again you might not see the preview unless you make a change okay this is something that is currently happening to me in the platform so if you ever get that then you just need to know that you just make a change and you will see the preview again like this just delete a character and write it again and since you have your translation already written over here you can also use these helpful options from the toolbar you can copy The Source this is helpful in case you have a long string and you just need to make some translations in a few words or you just need to use a large portion of the original string then you can just select this and copy the original string over here that can be helpful when you have for example tags or elements that don't have to be translated and you can just copy them without writing them yourself but we don't have that right now so let's go back to our translation you can also clear the translation by clicking here that will save you time and the third option is to go into text selection mode Let's click here and let's see what it does if we click on this option you will see that the translation memory and machine translation suggestions that crowding is giving us for that string are like in a different color right they are like in a dark greay that can be helpful to just select a piece of the string let's say that instead of writing this final part of the string I just want to copy and paste it from this suggestion this gives me the option to select it from here just copy it and paste it next to the word like this that can save me sometime as well if we don't have this option enabled then you will not be able to select the text individual from these options you will only be able to replace the entire translation one by one so that option can be very helpful when you need to just take a part of this suggestion copy and paste it awesome and over here on the right we find the string length specifically the length of the source which is 37 37 characters here and the target 41 so in Spanish writing this text or translating it like this is longer and sometimes for the user interface of let's say a website or a web app you might want to set a character limit and you can use these numbers to give you an idea of their length great so now that we have this we are going to save our translation by clicking on this button and after we save it now we see that it's highlighted in blue it is highlighted in blue once you have it saved and you will automatic see that you go to the next string the next string is replaced here as the source string and you can just continue editing here you can also see if there is some context for that string you can edit the context and just hide the context if you don't need it but you will automatically go to the next string if you want to go back to the previous string just click on it like this and you can always modify your translations you will also see the history of translations you will see this translation that was saved who saved it my username and when it was saved a few seconds ago in this case over here we also see some options we see Zero because in crowding when you have a project with multiple contributors contributors can vote different translations they can vote to select the translation that they think is most accurate in this case we have zero votes but we could have a vote and usually in the case of fre code cam we also suggest choosing the translation that was most highly voted by the community because usually that tends to be most accurate then then next to the right we also see approve this is a button that only proof readers or project owners or anyone with like administrator access has access to because this will approve the string for the proof reading phase so translators who only translate in the platform and don't prove read will not see this option but you will be able to approve your own translations even though it is recommended to make someone check your translations before you approve them and here we can also see if we can delete the suggested translation and some additional options but right now this option is grayed out so we don't have any additional options here this is what we call the middle button area the Spanish translations the translation memory and machine translation suggestions and you can also see translations suggested from other languages right now we don't have any but we could you can always resize these columns okay if you need to this is something that I also think that it would be important for you to know you can resize them they have a maximum WID but you can resize them and another thing here in the top middle area is that you can go to the next string by clicking on these arrows go to the next or the previous string you can also edit the string over here the original string and you have more options like hi height string from the translators copy the string URL Copy Source skeleton translation history and you can also view the string in context these are all helpful functions that I suggest going through if you have the time when you start diving into crowding more deeply great so now last last but not least we have the right sidebar this is where you can write comments search for the translation memory search for terms in your glossery add new apps and find the apps that you added through the crowding store you can choose the tool that you need to use over here in the right sidebar to the right of the right sidebar first we find the comments then we find the translation memory then the glossery where you can search for specific terms and you can also see some the file context that we were able to add in the settings remember this is the context for the file and you can also add new apps and you would see their small icons over here to write a comment you just need to go to the first option here comments on the sidebar and write your comment on the text input field at the bottom if you click here on new comment let's say that we have demo comment you can also Mark the content as an issue if you need to if this is an issue with a string or with a file you can mark it as an issue and you can categorize the issue it's this a general question is the current translation wrong is there a lack of contextual information is there a mistake in the source string you can choose any one of these categories for the issue for now let's not make this an issue and let's just click here to send the comment demo comment after you send the comment you can also edit it like this and save the changes let me just to make a change remove the period at the end edit it and you can also delete it over here but let's just keep it for now to have it as a sample and that's basically how comments work now if we go to the second option we can see search translation memory with this tool you can search search translation memory for previously made translations and reuse them to ensure consistency here you have some help like excluding words from the search using quotation marks to find the exact combination of words typing an esteras to find words where the end or the beginning may be different you have some examples typing a plus sign and here you have some examples so you have many different options to choose from but let's just search for the translation memory for welcome let's see what we get here welcome we can choose where we want to search search in Source or search in Target where do we want to search for this word if we search in the source language then it would have to be in English if we search in the target language it would have to be in Spanish search option we can also choose a numeric equivalence or guess the translation translation memory result here give us this okay the translation that we just submitted over here this was saved to the translation memory of our project so we can just use it right here and that would also appear here in the translation memory suggestions that is how translation memory works and in the third option we find terminology which is the glosser we can manage our glossies by clicking on manage and we can just go here to the settings and and assign different glossies or create new glossaries we can work with the glossaries in this option in the right side bar we can also search for terms here and we can add a new concept here by clicking on this option in crowding adding A New Concept can be helpful for the glossery we will talk about glossies in more detail but for now just know that you can add a concept and a term for that concept to your glossery and you will see them here in the list and finally the file context right now we don't have any but let's just add some context to show you how this works let me go to my project to sources and remember that we had that in the settings in the settings we find context let's just write something like demo context so you can see if this is updated in the translation editor let's save it the file was up updated and right now if we try to see this in the translation editor by reloading the editor again we see this demo context amazing right we are getting the demo context that we wrote in the settings and this supports markdown formatting so you can just add any context that your translators will need to translate the file accurately based on specific context like where it's located on your website or web application or Android application basically anywhere if you add a context you will also see this like a little warning here warning sign that says file has context provided for translators context can be edited in the file settings model the model is what we were just configuring here in the settings great and if you click here on the plus sign you will be taken to the crowding store when you where you you can add apps and Integrations you will be taken to the crowding store where you can add apps and Integrations for your projects we will talk about Integrations and how you can add them during the course there are multiple free apps and Integrations we will talk about them in more detail during the course but just know that you can add them to your file and project from here great another thing that you should know about the translation editor here is that if a string is hidden like this number over right here which is the page number you will see this tag hidden in the sour string you don't necessarily have to translate it and that will not be available for your translators if you want to Mark a string as hidden you can also Mark it here height string so your translators won't translate it and another great thing that I would like you to know about these tools is that crowding mentions that if the term that you search for or in your terminology tab in the glossery is not available in the actual projects glossery the system will show you Wikipedia explanations so let's write programming for example the term that you're looking for has no matches in the project terminology but crowding is super helpful and it will give you this Wikipedia definition it will give you more context about that term in the target language and in the source language so that is very helpful it will also give you like related Concepts that can be helpful to give you more context about the term and how it should be translated so it is very helpful even if you don't have it in the glossery already you won't be able to understand it without leaving the translation editor that's great for productivity awesome now that you know more about the translation editor and the user interface right now remember that we are in in the comfortable mode so let's talk about translation editor modes in the next part of the course we will see how you can customize the layout in a way that fits your needs because crowding has three options comfortable mode side by side mode and multilingual mode they're all very helpful they're different so we will see them in the next part of the course I will see you there the translation editor has three modes to customize the the layout in a way that fits your needs we have three options the comfortable mode which is exactly what you are seeing right now the side by side mode and the multilingual mode Let's talk about the comfortable mode well it's primarily used for translations it has these four main sections that we just saw and you can switch from this mode to the other two modes by clicking on this button here clicking on the menu icon at the top left of the translation editor then you click on view here and you have two other options side by side and multilingual if you click on side by side you will see that there is a change in how you see things you will see some tips for working with the side by side mode like how to review or make translations you can also approve multiple translations at once which is a bold action that can save you a lot of time if you are a proed reader and reviewing multiple translations you can switch again to the comfortable view to make new translations If instead of reviewing you want to translate and that's all friends so you can close that now this mode is primarily used by managers and proof readers to approve the best translations it's also used by translators to vote translations in a r so if you want to vote on the translations and you want to support the best translations you can do so from this mode but this mode is not usually used for actually translating it's more for a review process we also see four main areas we see an area with the strings their current status here the color tells you the status and notice that here we don't see the strings in Al alphabetical order or in the order in which they appear in the file that is usually why we don't use it for translation it's not really meant for translation you will see that the string that we just translated is actually at the bottom welcome to Free code cams curriculum and we see the translation over here if we click on it we are taken to the string in the preview we can reiz this of course it's another way of looking at the string but by default they will not be in the same order you can click on them and that will take you to the string in the preview but they are not in the same order they're actually grouped by their status so all the untranslated strings will be first in the list and then we will go to the translated strings and then approved strings and so on and here we also see that we have two hidden strings which will be at the bottom here at the top we see these options you can select all the strings for bulk actions on all the strings if you need to for example you can approve all the selected strings you can select them all or or just select some of them and approve them approve their translations in bulk so that's why proof readers really like this mode and here you can also search for terminology in the file let's see certification again we go to the strings that have this word in in the string just like in the comfortable mode that is the search filter we also see filter strings we can show all the strings but by default we see all the strings with the untranslated strings first the show all option shows all the strings in the original order of the source file so if we change this to show all we will see the strings in the order that they appear in the file that is how ful but by default you will see this option you can also choose to see untranslated not approved and approved strings or filter by quality assurance issues the issues that we saw previously that you can configure show the machine translation you can filter strings by strings that have comment strings with unresolved issues remember that we could Mark a comment as an issue we will see strings with unresolved issues for all languages or for the current language That We're translating we can also filter by hidden strings or Define our own filtering and sorting parameters here you can create an advanced filter but that is a bit beyond the scope of the course you can dive into this when you start working with crowding okay it is helpful you can use these Advanced options so now let's use this by default you also see some helpful data about the currently selected string you have the length of the source and the translated string you can save it you can cancel this you can copy Source you can also edit the string and you have more options over here similar to the options that we had in the comfortable mode you can also choose to pre-translated it via translation memory or via machine translation you'll find the string details over here and the suggestions and trans ations and previous translations you can see the translation and when it was submitted here you also have the option to toggle whether to highlight the strings by their status just like we did before and if you want to toggle the translation preview like this show the translated string or not it's basically a different layout but it's more optimized for proof ring great so that is side by side view now let's go to multilingual mode this mode is primarily used by translators and pro readers to work on multiple languages at the same time so for example if you're a translator and you know multiple languages this mode can be helpful to save your time you just need to go here to the menu icon here at the top left and go to view and select multilingual now you will see this when you are a multilingual view you can translate a string into multiple languages so let's say that I want to translate the string into Spanish and Italian let's say you just go here to the menu icon then you go to language languages and you select the languages like Spanish and Italian you can choose up to 10 languages at once you can also search fore language if you have a very long list over here then you choose apply once you apply that but you will see this change in the layout which is like very helpful if you know both Spanish and Italian or any combination of languages you can just take the string for example welcome to Free code Cam's curriculum and write your translation in Spanish here and write your translation in Italian here well I'm not very familiar with Italian myself but let's say that I was familiar with Italian I would be able to write my translation here directly but since I'm not familiar with Italian right now for demonstration purposes I will select a machine translations suggestion let's take this for example if I click here in the icon over here at the right I will be replacing the suggestion over here for Italian and I would be translating both languages at once that can save us a lot of time that's great right so here I have it it's it was added by me a few seconds ago that is also a practical example of how you can add or use a machine translation or translation memory suggestion just click here and have that language selected and it will be added automatically when you're working in multilingual mode you will also have two different options to view the translations you will have a list View and a grid view right now we are in list view which is like personally I would recommend using this and this one over here is a grid view the grid view gives you like more information for each string and you can scroll horizontally through the strings and through the columns and you will see like for each string each string will have a specific key to identify it uniquely in the system and you will see the string labels The Source language the translation in Italian and the trans ation in Spanish you will be able to click here on let's say Spanish translation write your translation over here use the suggestions if you need to and then save your translation so that is another way to translate in crowding when you want to translate into multiple languages at once the other parts of the editor and the tools in this multilingual mode are very similar to the side by side view that you're already familiar with so once you are ready and you want to go back to the comfortable mode to continue your translation let's say that you're just translating one language at a time you have two options to go back to the comfortable mode you can either click here on the menu icon then View and comfortable or you can click here this is like a shorter way to reach the same option here in editor view you click here and you choose comfortable Side by side or multilingual right now we are in multilingual so let's go to comfortable and voila here we can see this and we are back to Spanish over here and we still have our saved translation so that's great now you know how to switch view modes in crowding in the translation editor great work so far congratulations on reaching this part of the course now we will see how you can switch to a different file because so far we have been working with the same file throughout the course now we will see how you can switch to a different file we will see that in the next part of the course at some point during your translation or localization process you will want to go to another file once the current file is translated right that is very easy to do in crowding without leaving the translation Editor to do it you just need to click on the main menu at the top left then you go to file and then you go to open here we have other options let's just go through them quickly we see source file preview translated file preview we also see the option to download the file to export it to upload translations to check all the strings in the file we will see that in just a moment we can also replace in the translations or in sources but right now we're focused on opening a new file or going to a different file when we click there we will see these this list of files and right now we only have one file in our project that is the currently opened file if we had another file we would see it here in the list and we would be able to open it we just click on it we click on open and that will take us to the file just let's click on open and we're there great so if you have a list of files you can choose one but another way to do the same thing a lot faster is to click here if you click on the file name that will be a lot faster you will reach the same option and you will be able to choose a file and open it you can also filter files here if you have a complex project structure awesome now you know how to switch files now let's check how you can view all the strings in your project project as a list you will learn how to do that in the next part so I will see you there you also have an option to see a list of all the strings in your project you just need to go to the main menu here at the top left go to file and then to all strings if you click here you will see all the source strings for that file you will see them as a list you will also o see their current status here we see a string that was translated we see a string that is hidden a string that is not translated and you will also see a different status when the string has been approved let's say that we want to approve a string as a proof reader well proof readers will see this option over here and we can just click here if we want to approve it like this and there we go we see this green check mark that indicates that the string has been up approved this approval can be removed by clicking here remove approval and it will go back to the translated status that is something for proof readers and for project managers but that's basically how you approve a string in the translation editor and you can do that in the three different views and just a quick note before we move on to the translation editor settings is that you can also translate right to left language languages in crowding while some languages like Spanish and Italian are written from left to right other languages like Arabic and Udu are written from right to left crowding mentions that when translating between left to right and right to left languages some elements in the translation field in the editor might not be displayed the same way as they will be once the file is exported to make sure that the translations will be displayed correctly in the exported file crowding recommends clicking Copy Source this button when running the translations this is the first button in the toolbar then translating the text into the target language but leaving any variables or Texs exactly the same even if they do not look the same they will be in the right position when you export the file this is an example taken from the crowding documentation where you can see the translation of a right to left language and how this works you just need to click on The Copy Source button that we saw that basically copies the original string and keep variables and TXS exactly the same while you translate the text so now that you know this let's talk about the translation editor settings because you can also customize the settings of the editor so we will talk about that in just a moment stay tuned and let's go to the next part yes you can also customize the settings of the translation editor to access these settings just click on the gear icon located right here at the top right of the translation editor and that will open the model for editor settings you will see a list of settings that you can customize first of all you can choose to show translation memory suggestions with a minimum match of a specific percentage so if a suggestion matches by 70% of the string that will be shown as a suggestion but you can change that percentage by dragging this slider you can also enable QA issues to check the translations for common mistakes like punctuation tags spaces mismatch missing variables and other issues you can show a PumpUp that attempts to predict and automatically complete the transations while you enter them by default this is disabled but you can enable it clicking here you can also Auto approve if your project role is a pro reader or hire but you're also translating the translations added by you will be automatically approved if you enable this option however it's always recommended to have an extra pair of eyes just in case you have any typos or spelling mistakes or that sort of thing that can happen perhaps after looking at the text for too long we don't even notice that so it's always great to have a backup team you can also choose to automatically move to the next string that is enabled by default exactly what happened when we saved our translation we moved to the next string you can have keep this enabled or disable it you can choose the theme for your editor you may choose to use the Dark theme you may choose the light theme or you may choose the auto theme that synchronizes with your system you can also change the appearance of some of the elements in the editor like compact strings view show only the beginning of the source string so it fits in a single line on the list you can show the translation preview and you have different options here like HTML tags if they display or not so if you have like HTML files and you're translating HTML files and you have some tags then by default these tags will be hidden you can choose to show them hide them or just use this auto option which is selected by default you can also display non-printable characters or hide them they are hidden by default and these are more specialized settings you can find more information about them like translation field highlighting and real time spell check displaying and of course you can change the language of the user interface if you're more comfortable with the user interface in let's say Spanish or Portuguese from Brazil or German or Japanese or French you can choose that and you can change the user interface to your language you can also choose to autod detect your language so that can be helpful if it's more comfortable for you you can customize the settings to fit your needs and another productivity tip that I think is very important for you would be keyboard shortcuts to see all the keyboard shortcuts that you currently have available for your operating system just click on this keyboard icon at the top and that will show you a list with all the keyboard shortcuts for your current operating system right now I'm working on Mac OS but we also have specific shortcuts for Windows and for other operating systems just click on that button and you will see these shortcuts you can also change them because if you click here you will be able to modify the shortcut and you can reset them to the default or cancel the operation now that you know how to actually translate your project manually let's see how you can download the translated files remember that we are showing the basic functionality here we're not automating things yet but this is basically how crowding works for individuals who are working on small localization projects you can choose to automate this task but we will cover that later in the course so let's see how you can download your files we're going to see how you can download your translated files we're not going to translate our entire file we just have this string translated but we're going to choose the settings so that we do download the file with the translation that we have and the rest will be in the source language let's go to our dashboard we click here on our profile image then our username we see a new tab and we go here we see our projects after we reach that we just need to go to our project to the translations tab in the translations tab we will see an option to download the project as a zip file this might be collapsed you will may need to open this but translations will be download loed in the original format according to the export settings if we open this link we see the export settings the export settings are exactly what we have here when we saw the settings top we can choose to skip untranslated strings but we won't do that because we do have some untranslated strings in our file and we want to keep them we can skip untranslated files if we're downloading the entire project we can export only the approved the translations and we can also automatically fill in the regional dialects based on those settings the translations will be downloaded we just need to select a target language that we want to download let's say Spanish and then we have two options either build the the project or build and download if we click on build and download we will see that the build is in progress current language current file so we see a little bit of the progress might take a few seconds depending on the size of the project and then we will see a zip file if we open the zip file we will find a doc x file we uploaded it as a PDF but when we download it we're downloading it as a document a word file or a document that we can open in keynote in Mac OS or another text editor here we see our file but we do see the translation replaced over here so it worked if we translate all of these strings we will see the translated version of the file and that is great you can download it manually like this and you have other options to download it not just the translations tab a key thing to note is that the zip file that you're downloading here will have folders for each language if you are downloading all languages like this if you choose all languages then you will have one folder per language and each folder will have its corresponding files the names of the folders will have their corresponding language codes just a tip so you can identify them when you download them awesome and if you need to download all the translated files in just a specific target language you just need to select the language here like we did with Spanish this will download all the files for that specific language and you also have a third option if you don't want to download all the files in a language and you just need to download a specific file then you just need to go to your dashboard tab select choose the language and then go to that file if you click on the three dots to the right you will see additional options and you can click on download like this you will see downloading over here and then you will find a file in your downloads folder and that file will be the translated version in that language remember that we are selecting the language here when we enter this category in the dashboard tab so crowding already knows what we want to download and that is the translation awesome your download should start relatively quickly and you should have your files ready in just a few seconds or a few minutes depending on your internet connection you can also automate this process of exporting or downloading the translated files with crowding Integrations awesome now you know how to download all the files and individual files in your project so let's dive deeper into the concepts that we have been working with let's see them in practice and how you can work with them in crowding we will start talking about translation memory and how you can create manage download and assign translation memory for your project GRE work so far now that you know the basic features of the translation editor and crowding let's talk about more advanced features like the translation memory we have been working with the translation memory in the editor but now we will see the details of how you can manage that memory remember that the translation memory is like a database of strings that we have translated previously in our project and their corresponding translations this is helpful because reusing previous translations can save us a lot of time so are you ready let's begin let's start by creating a translation memory by default when you create a new project you will have a new translation memory for that project but you can also create it manually you can create one manually let's go back to our profile here by clicking here or by clicking on the drop- down menu if we click here on translation memories on this sidebar you will see all the translation memories that you currently have across your projects for example we see fream project demos TM the translation memory this has one record it's available for these languages English Italian and Spanish remember that we added a machine translation for the Italian string this translation memory is associated to this project if we click on it we can go to that project like this to the settings and if we see more options we can choose to upload the translation memory as a CSV or another type of format we can also downloaded we can edit it and we can view all the records in the translation memory we can see all the records over here if we click here we will see all the records in all the translation memories we can also filter the translation Memories by those that we own or those that we manage we can share translation memories and what this means is that we're going to share all the translation memories across our projects like this if we have this enabled they will be shared or otherwise they will only have the translation memories that we assign to each individual project manually we can also choose a translation memory over here we can select it and that will enable these options we can edit the translation memory view its records or create a new translation memory to create a new translation memory just click here on create TM you will find the TM abbreviation a lot throughout crowding so it's best to be familiar with this abbreviation TM translation memory and remember that Mt is machine translation they're different for the name of the translation memory let's just write demo te M and this translation memory will be in English let's say for now we're not going to assign it to any specific project but we can do so by clicking here on the name of the project if you have multiple projects you will see the list over here so you can click on Create and now you will see this translation memory added to the list now you have two translation memories you can select either one of them and you have your new translation memory in the list so congratulations if you click on a translation memory from this list like this one you will be able to view all the records in that translation memory if you click on this view records button this will show you the source strings and their corresponding translations in all the languages that it's currently available in so we have Italian and we have Spanish like this we can edit each individual r record like this English Italian and Spanish right now um I remember that this is a machine translation so it might not be 100% accurate I'm not familiar with Italian so I am familiar with Spanish and this is accurate but if there is anything that we need to change about this record we can change it here directly for that string we can also delete the record so it's not suggested to us anymore when we just translate if we have multiple records which is what we usually have for large projects like free code camp we can search for specific records here we can match the case we can match whole phrase and we can also find an exact match so these are helpful options that we can enable or disable and combine to our needs to fit our needs you can also upload machine translation if you already have this structure you can upload specific files with The Source strings and their corresponding translations into other languages just click on this upload button and you will be able to upload the file here we can see that we can upload translation memory in these formats xlsx remember this is a format that we saw in the slides at the beginning of the course a CSV file which is a comma separated values file or a TMX file these are the three options you can upload that translation memory and you will have it here automatically and you will will be able to use it in your project here you can see a screenshot taken from the crowding documentation this shows you how you can select the matching columns to their corresponding languages when you upload a file for the translation memory now you can also download your translation memory as an xlsx file as a CSV file or as a TMX file if you click on download just choose a format let's say CSV you can choose to download all languages or just a specific language pair so we have the source here English and let's say that we want to download the translations in Spanish we can choose that language pair and that will work but for now let's just download all languages to show you the file if we open the file uh the CSV file this is what we see we see the source string the language code which is English we see the target language Italian and Spanish and we see the corresponding translation so that is very very helpful in case you need to download it and save it locally or upload it to another tool another great thing about translation memory in crowding is that you can assign translation memory to your project here we have our demo translation memory let's assign it to our project let's go to our home here then to our demo project let's go to the settings tab and then we go to translation memories like this at the bottom you will find the assigned translation memories and if you want to assign a new translation memory a second one you can just enable this here and it will have that translation memory for the suggestions in the project the default translation memory will be marked by the star icon the translation memory with the gray star is used by default and you can also set the priority and one of the key things here about the priorities is that when you assign a few or multiple translation memories to a project you can set the priority for each one of them the suggestion from the translation memory with the higher priority will be displayed first it makes sense right but here a higher number represents a higher priority so if I assign priority to here according to crowding that would be a higher priority than this one so the the suggestions from this translation memory would have a higher priority than this one you can also view the records from each one of them but this is a link that will be opened in a new tab will take you to that translation memory and its records awesome now you know how to work with transl ation memory in crowding this is a more advanced feature so congratulations in the next part we will talk about the gloss series and how you can work with them in crowding so I will see you there awesome now that you know the most important aspects of translation memory on crowding let's check out the gloss series and how they work remember that a glossery allows you to store and manage your projects terminology to help your translators with more context and definitions let's see how you can create a glossery because when you create a project a glossery is automatically created for you for that project but you can create new ones that are independent from any project to create a glossery just go here to this option on the sidebar and you will see a glossery for each project that you currently have but if you want to create a glossery just click here on Create glossery and then you will need to enter the glossery name let's say glossery demo and you will need to select the language let's say English you can also assign the glossery to the projects that you can see on this list you can assign them to projects or not and if you don't assign them you can do that later too let's create it for Now glossery demo you can find the number of terms here here the languages and the projects that each glossery is associated with here you can click on the ellipses to find more options for each glossery you can upload the glossies as xlsx a CSV or tbx file format you can download your glossery in either one of those formats you can edit your glossery view its records and delete the glossery so let's see how you can manage glossery terms in crowding it's important to distinguish between a concept and a term a concept is broader than a term this is what the crowding documentation says about their difference a concept incorporates glossery terms and their variations with multiple translations and other relevant information so you can see the concept sort of like englobes all the terms and additional information to add a concept you select it you view the records over here and you will see that the glossery is empty you can ask translators to create glossery terms or upload a glossery to add a concept yourself just click here on ADD concept and you will see this detailed form for adding the New Concept it has many different options for including information about the concept here we have concept details the definition is the concept definition the subject is a branch of knowledge that the concept is related to you can also add short notes about a concept that translators might find helpful you can add a URL to the web page with relevant information about that concept and finally a figure which is like a URL to the relevant image if the concept is related to an image it also mentions these term details because remember that concept is broader a concept can have multiple terms and if we need to add a new term we can add it over here in any language for each term we will be able to select its part of speech like a noun verb adjective the part of speech the type is like for example a full form an acronym an abbreviation short form phrase or variant the status is preferred admitted not recommended or obsolete you can also choose the gender if the term has a gender masculine feminine common neuter or other you can write a definition for that term you can also include notes and a related URL to important information after you create the term you will see it in the list of terms for the Glasser you can choose what details you want to fill in you don't necessarily need to write all of this for each concept ccept or term even though that is recommended if you have all of this information because your translators will definitely thank you in the future for now let's just write the definition and the term like just to see what we get afterwards if we create the demo we get the new term here in our glossery we can see it here we can see the definition concept details and we can also edit the term and delete it but notice that here we are seeing the term over here the term itself and over here we see the concept that the term is related to remember that concept is broader so this is broader than the actual term in this filter we can search for specific terms and here we can also filter by users with this button we can change which columns are displayed like concept details we may choose not to include it we may choose not to include English or we can also hide all the columns you can also delete a glossery term over here if you need it let's just delete it over here delete this term and you will see that the glossery is empty again you can upload or download a glossery as a an xlsx file a CSV file or a tbx file just click on this button and you will be able to upload it or download it you can also delete glossies here if you go to your glossies panel your glossies tool by clicking on the ellipses and then clicking on delete just delete this and to confirm the that you're absolutely sure about deleting the glossery you need to type a specific number that crowding will give you 419 316 delete and there we go we don't have that glossery anymore now how can you assign a gloss to a project well you just go here to home you go to your project you go to settings and here in Translation you will find glossaries here you will see a list of all your glossies and you will be able to select the glossies that you want to use for your project over here the glossery with the gray star will be used by default for the project you can also share glossies across all your projects by checking a specific specific option here in glossaries if you enable this option share glossies which is similar to sharing the translation memory remember you will be sharing the glossies that you create across all your projects that can be helpful sometimes so you can enable it but it is disabled by default awesome now you know how to work with glossaries in crowding so let's go to Quality Assurance checks in crowding and let's see how they work this is another Advanced feature so so let's dive in now let's talk about quality assurance quality assurance is essential for every type of project and this is especially true for localization projects one small typo or spelling mistake can make all the difference to your users this is why crowding implemented efficient quality assurance features to help you deliver the high quality translations that your users deserve to have in our case is the free code cam Community according to crowding these checks will help you to detect some common mistakes easily and quickly and you can resolve all those issues before you actually get the strings live the issues detected by quality assurance check include typos missing commas Extra Spaces and other common mistakes that you might make while you're translating or that your translators might make let's see how you can configure these quality assurance checks this is done for every project individually you go to your project then to your settings tab and then you go to QA checks in Translation here you will see all the quality assurance checks that you have enabled and you can enable or disable them based on your current needs once you enable or disable whatever you need let's just disable some of them as a sample and then you click on this save button you will see that the settings were updated that's great after you have these settings enabled or disabled or customized to your liking let's just enable everything for now how can you check the quality assurance status of your project well you just go here to your dashboard and over here you can see QA checks currently the status of the QA checks is in progress so the checks are running they are in progress if you reload your project you may still see it in progress but here you will see the status of your QA checks you may see them as off when they are disabled let's just try to disable them for now you can disable them by deselecting this and saving your settings and here if you go back to your dashboard you will see that they are off if we turn them on again like this we save our changes and we go to our dashboard we will see this in progress and after the checks are completed we will see a different status no issues if the checks did not find any issues with our strings or issues found when there were issues found and we will also be able to see these issues when we try to approve a string let's go to our Spanish translation and let's just to test this add an issue to our translation let's add an extra space here this is looking really bad right but let's save our translation for now and when we try to save our translation our quality assurance checks are checking if everything is correct but they detected that the translation contains three spaces in a row we have an option to autofix the issue to save the translation anyway if we are sure that this is actually not an error or to cancel the operation and we can just change this ourselves let's choose autofix this will autofix the translation and then we can save it again what happens if we try to save the translation again well we see this check that says that an identical translation of the string has been already saved vote for the existing translation instead of adding a new one if we save the string with issues like these let's just save this with issues we see that the translation contains three spaces in our Rob but let's just save this anyway and we go back to the string we see that this string has one quality assurance issue the translation contains multiple spaces in a row that will be helpful for the proof reader who is going to check and approve the string and we can also see this if we go back to our project and we check the status the quality assurance checks are still in progress but after the process has been completed we will see that there were issues found and we will be able to fix them in the strings that is the power of quality assurance checks now after I approve the string the string is now in green because it has been translated and approved this is a sample image from the crowding documentation showing what you would see if the quality assurance issues are found in your project you would see something like this quality assurance is a very important step that you should definitely take very seriously during your localization process so now you know how to enable them and work with them in crowding let's continue in the next part of the course we will see how you can upload existing translations you will have three different options so we will see them in the next part of the course I will see you there if you have existing translations already written in a specific file format you can also upload them to your project and use them directly you have three options you can upload them via the translations tab over here you can upload them via the specific language page or you can upload them via the translation editor we will see a three options you can upload translations from this translation tab by clicking here upload existing translations if you drag existing translations here you will be up uploading them and you can upload them from your file system according to crowding the supported formats for uploading translations include those that have a key value structure such as for example Json or Android XML Mac OS or iOS strings and there are many different formats here you can find a list also CSV files are accepted and crowding also mentions that for file formats that do not have a defined structure translation upload is handled bu by an experimental machine learning technology so when they say experimental that means that it might not be 100% accurate great that is how to upload it from the translations tab you can also upload them from the language page you just go to the dashboard tab then you click on a target language and then you click on a file but instead of clicking on the name of the file itself you will click on the three dots to show more options and then you will see upload translations you can allow Target translation to match the source you can approve added translations or you can translate hidden strings those are options that you can enable before you actually upload your file just click on select file and you will see your file system an option to select the file from your file system and that will upload the translations for your file and finally the third option is to upload via the translation editor if if you double click on the name of the file and you go to the translation editor then you can click on this menu and then in file you will find the option to upload translations you will see the same three options and you will be able to select the file from your file system awesome now you know how to upload translations there are many supported file formats on crowding for all of these operations because so far we have mentioned many different file formats during the course that you can work with in crowding but actually crowding supports more than 100 file formats you can view all of these formats in the crowding store over here all of these formats are supported by crowding you can filter the list with this search bar you can also filter them by author or by tag and you can sort them by relevance name and date you just need to go to support. crowd.com /s supported format and then you click on this button view on crowding store that will take you here to this list and there you will find the catalog of all the formats that you can use and work with in crowding it and it's very helpful for any type of project great now you know all the supported file formats so let's talk about pre- transation remember pre- transation it was a way to translate your project files automatically when you upload them so we will see how you can enable enable that in crowding now let's talk about pre- transation if your goal is to save time and improve your productivity pre- transation through machine translation can be exactly what you need this is an automated process that applies computer generated translations to your project when you upload a file and you can set that up in crowding in cring you can customize machine translation engines to use this feature you have two alternatives to implement the process you can do it either manually or automatically so let's talk about the manual pre- transation to configure pre- transation for your project you just go to your project to your dashboard Tab and then here you see the option for pre- transation remember these acronyms I told you that their difference was going to be very important because crowding uses these acronyms very often and they are very similar so at first you might find them a bit confusing but remember this is translation memory and this is machine translation if you choose to pre- translate via translation memory you will be using the database of existing translations from your project and if you choose via machine translation you will be generating the translations automatically if you choose via machine translation you will need to choose a translation engine by default you will use crowd translate but based on your current plan you might be able to choose another translation engine like Google translate or Amazon translate or any translation engine that you need you can choose the target languages you can choose different files and you can filter by labels and exclude labels so that is what you can do to set up pre- transation via machine translation you just choose your target languages choose your files and you can see that this enables the button for pre- transation Via machine translation this will give you automated translations translations generated by a computer by an artificial intelligence model that your proof readers should check before they are approved but it can save them a lot of time if you automate this process because they will have something to work with and they can just modify them you can also enable this for specific Target languages if you don't want to do that for all your target languages and you can do that for specific files you can use these search filters to filter the list if you have a complex project structure if you choose to automate the process the system will pre- translate new content automatically and another great thing is that you can set up pre- transation via translation memory if you have to use translations from your database of previous translations if you have shareed translation memories option if you have that option enabled all the translation memories from the projects you own or manage are already shared so you can pre-ra using them you can select the target languages for which you would like to use this automated process and select the files you can also set the minimum match ratio to translate only if it's a 100% match you can skip any approved translations apply for untranslated strings only this is very helpful and it is selected by default so you don't end up translating strings that were already translated and you can also approve added translations but only if they have like for example a perfect match a perfect match that was approved by a pro reader previously or you can just approve all of them skipping Autos substituted suggestions or all of them by default if you enable this option you can choose either one of these options you can also filter by label exclude labels and you have these notes for auto substitution and prioritize translation memories in the settings tab how you can assign and prioritize the translation memories we talked about that in a previous section right how to assign them a specific priority if you set this up your files will be automatically translated then you can open the files in the translation editor and and just check the automated translations but you will have something to work with immediately and that will save you time great that is how you can work with pre- transation in the next part we will talk about offline translations because sometimes you and your team will need to work offline crowding has a great feature for this and we will talk about that in the next part of the course now we will see how you can work with offline translation because sometimes you and your team may need to work offline crowding has a great feature for this you can download your files for situations where you may not have access to the internet or you may like to work with the files locally and then upload your translations to enable or disable offline translation for your project you may choose to disable it as well you just need to go to your project then to the settings tab and then privacy and collaboration after after that you will find this option allow offline translation this allows translators to download the source files to their machines and upload translations back into the project project owner and managers can always download sources and upload translations so this is basically for translators and prove readers owners and managers will always have this option we can enable this or disable this each file can be downloaded individually in two different ways the source files you can download the source files themselves to translate them locally and then upload your translations you can download them via the translation editor or via the language page let's see how you can do that via the language page just go to your project to the dashboard you select the language let's say Spanish and then in the list of files click here on the three dots and then just download it if the file has not been translated you will will see the original source file because if you assign that task to a translator and no one has ever started translating the file you can just download it and you will see the original file in English if someone has already started translating the file you will see the translated version with the translations that have already been approved like this but if you haven't started translating the file that will be exactly the same to the original source file that is the first option but you can also download the file from the editor let's just go to the editor by double clicking the file here and let's open the menu you will see the option to download from here you will be downloading the file you will see it in your list of downloads and if you open the file you will see the file over here with the translations of course but if you haven't started translating it that would be the source file awesome now you know how to download individual files for offline translation you can also download all the files for a specific language in your project if you want to download all the source files let's say that you need to translate for Spanish you haven't started translating them yet then you can click here to download or upload download translations upload translations and you can export them in this format awesome now you know how to work with offline translations that can be very helpful for you and your team now let's see how crowding can help you if you're working with a team on a localization project or perhaps you're the founder or manager of an organization that is interested in localizing a product and you will need to work with team members let's see these features in crowding first we are going to see how you can invite project members and contributors to invite members to your projects go to your project and then go to the members tab once you're in the members tab you just need to click on the green invite button you can also click on this button and then you will see the option to invite people you will need to enter information for these options before sending the invitations first you need to select a specific role then you need to enter the emails or or usernames because you can invite multiple members and afterwards you will find a default message here you're invited to join the project and then you will see the name of your project here by default but you can customize it to your liking or you can just leave it blank if you want to but of course it's always best to be kind to the new team members so I would keep this or customize it let's see how this works if you click on select role you should see something like this you will see all the available roles that you can assign in crowding by default the translator role will be selected because this is what we will usually assign for team members right translators they can translate the content and vote for existing translations you will also see these roles manager developer translator proof reader and language coordinator we will talk about these roles in more detail in just a moment but here on the right you will see these fields in these fields you can assign specific languages for which you would like to assign these roles to that member or those members for example you could assign the role of translator for a particular contributor for the language Italian and you could also assign the role of proof reader to that same contributor for Spanish or you can assign both languages Italian and Spanish so the contributor would have these roles for these specific languages but if you want to assign the role of proof reader or translator for all the languages that you currently have available on your project you just leave this empty we will talk more about member roles in just a moment once you're ready you just click save here and you go back to the main options for now let's just assign the role of translator for all languages okay let's click on Save here and we go back to our invite people form let's just write an email here to send an invitation you're invited to join the project free code cam project demo if you click here on invite you will send an invitation to that project member but there is another way to invite that member you can also send invitation links if you click here on get link you will also have the invit URL copy to the clipboard and if you just copy and paste it let's just copy and paste it on a plain text file to preview it you can see that it's a URL a crowding URL with your project and then it has a specific invite code when the new team member clicks on this link they will be able to join the project with the permissions that you granted them and after you get a link you will also be able able to manage links by clicking here manage links these are the links that you've generated so far here I clicked on the get link button twice so I have two links you can see that the times are really close and you can see the roles assigned with that link for that member and you can also click here to copy the link to the clipboard or you can also revoke the link let's just revoke this as a test and it's removed from from the list of links that we currently have available if we click here we just copy the URL to the clipboard and we can paste it anywhere we need to like an email or a chat anywhere where we want to send the invitation to the team member once we're ready managing the links we just click on done and let's also test how the invite button works I am going to send an invite to one of my emails to my one of my accounts select the role of translator and with this default message let's click on invite over here and I see that one invitation was sent successfully now if I go where I received the invitation like I am seeing what a member what a normal member would see in might take a few minutes two or 3 minutes and then I got the invitation to join the project to join the translation project this is what the new team member would see when you send them the invite hello the Stefania demo in this case the project owner invites you to participate in the free cam project demo translation project at crowding here we can see the default message that we sent with the invite of course it would be great if you customize this to invite your team members and here we see a link get involved if user clicks on it they will be taken to the project and they will be added to the project so let's open this in in an incognito window because right now I am in my crowding account so I have to simulate as if I have no relation to that account I am just a normal person what I see is that I have been invited to the free code cam project demo project with the following permissions as a translator I can sign up for free or log in and I will automatically join the project so if I create that account and I join with that link I will be able to contribute to the translation project and just to have one contributor and I so that I can show you all the different features of how we can handle team members I'm going to do that with my second account I have two accounts on crowding one with the project and another one to simulate a contributor so that's what we're going to do next now you know how to invite new contributors you just select a role you write their emails or usernames like sample gmail.com and then you just write the message send the invite or you get a link great so I am just going to sign in to my other account accept the invitation and I will be right back to this project this is my second account this is the other account that I created on crowding and this is what I'm going continues to simulate being a new team member let's say that I received this invitation by email and I just clicked on get involved I created my crowding account and after I click on that link I see this welcome to Free code cam project demo translations you have joined the translation team you can leave this project if you don't want to participate in the translations so if you click here you will leave the project but since you joined this is is what you would see as a contributor and now that we have this new contributor in our project let's just go back to our project owner perspective this is from a contributor's perspective we just accepted the invitation we're part of the project now but what will you see if you are the project owner that is what we will see in just a moment let me go back to my project owner account estefania demo and here I'm back with my my project owner account here I can see my project I own one project but now we do have an an important change now if we go to the members tab we can see that we have another account another member of the team right now Stefania demo is the project owner account it's my account my personal account where I created the project this is the owner but this is a translator I just used my name here but it could be any team member that I added to my project okay what can we do with this once we have our team member already signed up for a project project roles can play a key role in this platform as well because you can grant different permissions to your team members now that you know how to invite them let's see how you can change their project role we can find more information about the different roles that we can assign by clicking here on invite and then clicking on the role this will give us more details about each role in crowding and what it involves a manager has unlimited control over the entire project developers can upload files edit translatable text connect Integrations and use the API they cannot manage project tasks members and reports that is reserved for managers and and project owners but they can work with the files translators can translate the content and vote for existing translations usually when you add a team member the new member will be a translator by default and then you can upgrade their role to Pro reader and Beyond Pro readers can translate and proofread the content they are in charge of checking that everything is okay with the translations and with the localization process and finally we have language coordinator language coordinators can manage people of selected languages because here we can also assign these roles for specific languages remember so we can also have language coordinators for specific languages to assign a specific role to a member you can either select the role here in the invitation when you invite that team member and you can also select the role on the member's profile page let's see how you can do that because you already know how to select the role here on the invitation if you grant manager the manager role by default that will have unlimited control over the project so all of these will be like marked by default and they are gray out okay but if you go here below you can assign the different roles individually as well so now that you know how to do this in the invitation let's see how you can do that in the memb profile here we have estefania CN this is the username of my team member if I double click on this member I see member info this is like a summary of that member in the project it's very helpful here you can see the profile image the username the roles that it currently has assigned how you can also click here to contact that member when the member joined when it saw the project for the last time and how many strings the user has translated approved voted and commented we see that please note that this data only shows current contributions removed ones are in display here here you have some options for that user remove contributions remove contribution you can open profile remove from Project or block a project because yes if you need to you can also remove or Block members from your project because sometimes things may go wrong with someone in the project so if you need to block their access entirely you can do so from here and here in the permissions tab you can also change their roles right now we only have translators selected but let's say that I want to upgrade this to proof reader and I want to make this contributor a proof reader for Spanish I can let's say that this team member can translate and prove read in Spanish so I would just add the language here and select that rle approv reader and select Spanish over here and after that I just need to click on save like this and then done we need to click twice on this button first to save and then to close this done like this and now we see that the project roll has been updated like this we see translator and then a shortened version of Pro great so now you know how to change the project role you can do that on on the imitation itself or if you already invited the member remember that you can just open the members info and change the permissions awesome in the next part we will talk about project managers they play a key role for the team and for the project so we will dive into the functionality that was specifically designed to add and manage project managers in crowding we will talk about this in the next section so I will see you there project managers play a key role for your team and for your project they can have unlimited control over the entire project and they can help you to coordinate and assign tasks to team members we will talk about tasks in more detail in just a few minutes in an upcoming section but now let's focus on Project managers and let's see how you can add a project manager to your project you can assign the role of manager here in the invitation you just click on the roll and you select manager here the manager has unlimited control over the entire project and alternatively you can also add managers by going here to managers on the left sidebar and if you click here you go to managers you will see that there are no managers yet invite project managers who help you manage your projects in crowding you can modify permissions for a user at any time and this is where our member account Stefania CN will come into play we will grant our contributor manager role if we need to invite a new manager for our project we can click here on ADD manager we will need to enter the email or username of the manager that we are inviting writing we can also write a message and we can set the manager's permissions if we want the manager to be able to manage the projects the translation memories and the glossaries we can click this to select all of these if we had multiple projects here we would see a list with all the projects and we could select specific projects for that manager we can also choose specific translation memories for that manager to manage and we can also select specific glossies all the translation memories and glossies that are assigned by default to a project are also marked by default okay here we have our only demo project that is one way of inviting a manager but we can also promote an existing team member to manager and we can do that here by going to our project then going to members and then just changing the role of that member we just double click on its user name or click here on details we go to permissions and then we select this manager the manager has unlimited control over the entire project so we save this we click on done and now we see the project role of manager again if we go back we see manager and now the role has been up updated here if we go to the managers section here on the sidebar now we see this user as a manager and it's the manager for this particular project from this list of managers we can also edit the manager's permissions and everything Associated to that manager if we click here on the ellipses we see edit permissions and remove we can remove a manager we can edit permissions and if we edit permissions we see this we can change the permissions for specific projects let's say that we don't want this manager to have permissions over this project anymore we just unmark it uncheck this or if we selected multiple translation memories and now we want to remove those permissions we can just update this and save the changes we can also go to that user's profile by clicking here it will be opened in a new tab like this so let's just save this and voila here we have the updated manager you can also remove a manager by clicking here on the ellipses and clicking on remove we are asked if we would like to remove this manager we can click here on remove or we can click on cancel for now we're not going to remove the manager but just know that you can do that anytime you need to with the ellipses and remove there is is an important difference between a manager and a pro reader on crowding managers and pro readers have key differences in their roles and permissions to explain this in more detail we can go to crowding knowledge base you can find that at support. crowding docomo project participant roles QA this is this article managing roles of project members and then you go down here to Q Q&A questions and answers this is important I think to know the difference between a manager and a pro reader the question says I'm a project owner do I need to invite a manager or a proof reader what do I need the main difference between a manager and a proof reader is the following in addition to approving translations added by translators managers can also invite and remove project members so they have higher permissions upload source and translation files to the project set up Integrations Etc so they have additional permissions than just approving the translations if you want to have a project member who should have access to the features mentioned above you need to invite a project manager alternatively if you plan to manage the project yourself it will be enough to invite a proof reader so that is the answer to the question the difference between manager or proof reader awesome now that you know more about project managers let's talk about tasks because tasks in crowding can help you to stay organized and manage your projects more efficiently we will see them in more detail in the next part so I will see you there let's continue organization is the key to success in any project and crowding definitely knows this because they Incorporated very helpful tools called tasks on their platform to help you organize your project and coordinate tasks among your team members with tasks you can assign specific files to your translators and proof readers you can set duat for specific tasks you can receive notification discuss specific task with other team members and even split a task among different team members you can also track the status of each task in a board where you can drag and drop your tasks from one status to the next that sounds great right it's a great tool for tracking the progress of your project so let's see how you can actually create them and work with them in detail to create a task you just need to go to your project and then to the tasks tab over here at first of course this will be empty we won't have any tasks but don't worry we will take care of that in just a moment we're going to create a task to do that we click here on the green create task button there we will see new task please note that a task can only be assigned to one project so that is why we have the tasks tab within a specific project all the tasks that you create here will be applied to that project let's try to create a new task what kind of information can we enter we can enter the task name let's say for example translate the welcome to Free code cam file let's just add this name and we can enter a description we need to translate the welcome to free codam file as soon as possible just as a demo description you can of course customize this to your liking then we see the type what is the type of task well we can translate the the file or complete the translation by our own translators we can prove read it by our own prove readers but for now we're going to translate it by our own translators we can set a du weate let's say that well right now we're in December 2023 so let's say that I want to have that file ready by December 8th we can set the time a specific time we can change the hour here with the slider and we can also change the minute that's really nice right we want to have this ready by let's say 10:30 great so after we have that we just click somewhere outside the calendar and we can move on here we have an option for the strings the task will be assigned or will be related to all the untranslated strings or we can also set a specific range uh date range for the strings that will be assigned to the task for example all the strings that were modified today all the strings that were modified in the last seven days this is helpful for reducing the scope of the task the because remember that you will be assigning this to translators and proof readers so they should have a clear idea of what they should be working on so this just helps you to narrow down the scope of the task or you can just select all the untranslated strings and keep the task Broad and open you can filter by labels you can exclude specific labels for the strings you can skip strings that are already included in other tasks that is also very helpful if you select this you will be skipping strings that are already part of other tasks to avoid any duplicate work from your translators so you can select this option which is broader but still avoid duplicate work with this option and then we see the files here you will see all the files of your project you can also filter with this search bar and to select on a specific file you just click here to select the file here you see the number of words and you will also be able to assign a specific language for the task or multiple languages if you need to please note that if the task has more than one target language here then the system will create a task for each language and just to show you that I'm going to select let's say Japanese and Spanish we're going to see this after you select the target languages you can assign spefic specific team members to the specific Target languages for example let's say that I want to assign a team member to this task in Spanish I can click on assign and I will see a list of my current team members of users in Spanish and I will select this one my team member account okay so if I select this user I have it here in the list and if I have like hundreds of users here I will will see a very long list and I can search for users here using the filter I can also like show managers show developers language coordinators proof readers and translators if I just click on one of these I will be filtering the list show translators show prove readers and based on whether we have the check mark here or not that means that we are showing these roles here we're show for example here we know that this is a project manager right so you can filter the list like this and you can also split files split files is interesting it's an interesting option because if you would like to assign multiple team members to the same file to work on different parts of the file like let's say that you are translating a very long article and you want two or three team members to work on the same file but without any overlapping work you can split the files and assign them to those specific strings if you split the files you will see this the approximate number of words that they will be translating and you can see unassigned words and we can clear the list by clicking here on the trash can we can also deselect members by clicking on their name let's click on apply here and now we see the profile image of the user that we just assigned and if we hover over the profile image we will see the username awesome so let's keep this task as it is translate the welcome to Free Goan file this is the welcome to free file so this is like a basic task but of course you can customize this to your liking let's create the task great task created successfully awesome we have three different categories a to do category an in progress category and a done category these are like the different status that a task can have for now we have this task one task in Spanish and one task in Japanese if we click on the language we will be expanding the details of the tasks and we will see the maass individual cards we have the same task per language if we select multiple languages so they will be kind of independent of course they will have a different number of words based on the the language and the source files and everything everything let's check out the details of a task here in spanish if we click on the task we will see more details like the language this is the description this is the title this is the number this is the task number that we can use to identify it the type of task we see when it was created modified the due date we also see how many files it has the number of words and strings mod if IED if there is a specific time range for the strings we see who created the task the username and if we click on it we will be taken to that profile we see the members of the task assign words and how many words are left and we also see some actions like view strings and Export at the bottom we find two sections here we can see the files related to the task and we can also write a comment this is help because we can keep conversations related to a task on the task itself that is very helpful let's say we need to work on this file just as a demo comment if I click on send here I can add my comment I see the username when it was published and the comment itself here at the top we see three options to do in progress and done and that is very curious because those are the three three categories that we saw here in all tasks if we click here we go back to the main boorn to do in progress and done and actually that is one way to change the current status of a task if the task is already in progress we can click here and the task will be updated to in progress if we go back to the main board we will see it here in the in progress category of the board another great feature is that we can drag and drop the tasks like this instead of changing them inside the details we can just change their status like this or we can do that from here manually and we will see them updated as well once a task is done we can mark it as done here like this and we also have the option to close a task there is a difference between a task being done and a task being closed it's not the same the task can be in the done status or category and still you will need to close it and you will be able to see all your closed task if you click here right now we don't have any closed tasks so let's just close one now and now it's disappeared from the board we only see the Japanese task we don't see the Spanish task anymore but if we go here to the closed status we see the task over here if we click on it we go back to the details and we also have an option to reopen it if we click here on the ellipses reopen we can also edit the task and delete it if we click on reopen we will be reopening the task and after we go back to our board we will see it again reopen the task so that is how you can update the current status we also have other options over here like exporting and uploading translations we can view the strings related to the task in the translation editor and here in the ellipses we can edit the task we can close it and we can delete it if we click on edit we will go back to a form that is very similar to when we created the task initially we see the duate when it started when it was was resolved we can filter by labels change the files change the target language assign new team members for a specific target language and we can also reset the task scope and progress but the progress for the files will be reset as well so be careful choosing this option great now you know how to edit and close a task you can close it directly from here as well you don't necessarily need to close it from the board it will we click here on close we will see that the task was closed just as before and we can keep it closed or we can reopen it once the task is closed you will see when it was resolved you will see all the comments as well they're all kept there so you can see the previous discussions that you had and you can reopen it like this that's why it's also great that they're independent because you can have independent conversations per link language and now let's see how you can actually delete a task because so far we've created managed and closed tasks so let's see how you can actually delete a task this is the Japanese task that we created let's follow the normal workflow that you would follow for a project first you created as say you to do then let's say that you move it to the in progress status then to the done status and after that you close it once you close it you can keep it here or you can also delete it you can also delete it before closing it but usually when we create the task is something important so we delete it if we created it by mistake or if we made a mistake we can also edit it so we click here on delete and we see delete the task translate the welcome to fre Cod cam file if the task is completed you can close it or or Mark as done so for now let's check how this is deleted by clicking on delete and we see that the task was deleted successfully awesome let's see how you can go to the translation editor directly from the task let's say that this was assigned to me and I want to start working on my strings if you need to go to the translation editor you can just click here on view strings and that will take you to the translation editor for your project in the knowledge B crowding mentions something very important about tasks here we see this question how do the source file updates affect the existing translation and improv reading tasks that is very important for for a project that is constantly being updated like for example a platform like free code cam we're constantly updating the curriculum and different resources let's see after the source file update the list of source strings included in the task will be updated in the following way the strength removed from the source file during the update will be removed from the task the modified strings that are marked with the keep translations option will appear in the task with the new modified text and the newly added strings won't affect the existing task in any way if the source file is restored to the revision containing the removed strings they will reappear in the task so so this is how crowding handles these constant updates to the source file great now you know how to work with tasks as a project owner or a project manager reports can be very helpful for understanding your team's current progress and activity crowding has a reports feature where you can track and check your project status to access the reports of your project project go to your project and then to the reports tab there you will find very helpful and graphical reports about the status and activity of your project here the first thing that we can see is that we have the project status and your Top members we will focus on the project status and the Top members here we find the size of the project how many words it has how many translatable words because remember that some strings are hidden from translators they're not translatable so that is why this number is different we have the source language how many Target languages we have how many members we have and how many managers we have we also see the progress bar here translatable hidden and duplicates we also see this bar here with the number of translatable hidden and duplicate words and over here we have interactive Graphics which are like super helpful I mean let me show you how they work you can see your translation activity prove reading activity and sour strings activity in specific periods you can filter them by day by week by month or by year let's keep the month range and here we can see the number of translated words and how that has changed in the period that you selected the number of approved work words new members active members and here we have an interactive graph with dates the Blue Line the blue graph is the number of translated words the green line is the number of translated words by translation memory and the light blue graph are the words translated by Machine translation over here so you can see all these three statistics per date you can also see proof reading activity by approved words and votes and Source strings activity by added words deleted words and updated words and if you ever need to check the performance of your team members and find the Top members to congratulate them or reward them you can go to Top members here and you can select a date range in the calendar you can just select a date range and generate the report like this that will filter the list to give you your Top members for that date range let's select this one right here and it's very easy to select the range because once you click on the day and you just need to move your mouse to expand the range like this let's start here from November 19th to December 3rd and generate the report and now you see that the date range has been updated and over here we can see the users this is my project owner user or account and this is my sample member account like this is a contributor we can filter Top members by language remember that we have six Target languages here let's say Spanish we have this one and we can also change the layout of the presentation like this we can choose which columns we would like to include the username languages that the user translates into number of translated words Target words approved voted and if we just deselect one of these you will see that the column will disappear this is helpful to customize the layout and the data that you will be getting if you would like to export this report as a CSV a Json or an xlsx file you have these three options to export this table you can also include the number of Plus or positive votes received number of negative votes received winning and joined when the member joined the project you can also scroll horizontally if you add all the columns but by default you will only have the basic ones the other ones you can add them as well and you can change the page here if you have multiple Top members by clicking on these arrows right now they're gr out because we only have one but if you had multiple Pages you can change the page here and you can also filter the user by the username by using this search bar great another great thing about the project status here is that you can choose the unit of this report if you would like to measure the performance in words you can do so but you can also change that to Strings number of strings now instead of words we will see translated strings approved strings and everywhere where we had words now we have strings instead and the data will be updated appropriately we have strings words characters without spaces and characters with spaces but by default wordss will be selected in the crowding knowledge Bas in the project reports article you can see a sample of these graphs for an active project like this one you will see the three graphs the total translated words the words trans translated by translation memory and the words translated by Machine translation this is what a project like freom would look like for example once it has some activity during a time period and for Source strings you will see it like this number of added words deleted words and updated words in blue that's also very helpful but now we see it as a sequence of bars instead of a line graph awesome so now you know how to gen generate reports on crowding and how to export them when you need to you can export your list of top members if you need to and check your project status so let's dive into conversations and crowding because communication within a team is very important and you can communicate with your team members directly on crowding with this feature so I will see you in the next part of the course let's talk about conversations communication is essential for any successful project you and your team members can communicate directly on crowding with the conversations feature with this feature you can communicate with one or more team members in a private chat each conversation has a subject so you can easily find them among all your conversations so let's see how this works to access your conversations you just need to click here on this icon we see no unread messages right now but that will take us to create a conversation to create a conversation first I need to search a user by name or username I can also filter users by contacts or by the users of all my projects I can filter my users by their roles as well if I know that I need to talk to for example a project manager I can just select all the project manager ERS I can select translators and I can also filter by language if I want to get a list of all my translators for Spanish let's say I can do so like this right now I don't have any I have one manager which is my other account to show you all of these features how this works with two crowding accounts once I have that user here I click on the user and this is added to my list and then I click on go I can remove the user if I don't want to include it by clicking on the X then I click on go and now I see a new conversation the conversation can have a subject or a title that you can use to filter and find that conversation so let's say let's say that I want to talk about creating a new glossery for example just as a demo I can write create a new glossery as the subject and I can save my subject create a new glossery I see it here in my conversations and I see that this conversation only has one invited member which is my other account and here I can just click on the gear icon to change the subject it's like editing the title okay and over here I can see that today Stefania demo my main account created the conversation and edit one user like this I can also see the time when this happened and if I need to I just write my message over here it's very intuitive let's say let's say do you think that we should create a new glossery for the project and after I write my message I click here on send and there we go I have my new message here and just like a normal chat application that we use every day we will see all the messages vertically in the order that they were sent and we also have additional options for each message we can share a message we can mark it as unread for us to review later later on we can edit the message and we can also delete it if we are the ones who sent the message we cannot edit or delete messages sent by another user let's say that I need to edit my message I can just edit it here let's just add the word hello hello hello do you think that we should create a new glossery for the project here and we if we edit the message just know that this will be added at the end edited and we can also delete the message like this if we click here we will see a confirmation message delete this message the action cannot be undone so we just delete it and it just disappeared another great thing is that we can filter conversations we can search for something in conversations by writing the text that we're looking for in the search bar and we can start a new conversation by clicking here on create conversation again the same process we filter the list we write the name or username we select the users and then we click on go to start a new conversation so that is basically the conversations feature and how it works great so now we're going to start diving into Integrations what are Integrations how can we use them how can we add them to our projects and what free Integrations can we use in coding let's see here we have our previous project the free codam project demo but for this demo I'm going to create a different project so we can actually work with the Integrations and import our file instead of uploading it manually like we did before we're going to create a new project really quickly project project name Integrations demo free go camp Integrations demo like we saw over here public project visible to everyone you can restrict access to specific languages after the project is created so that is very important too let me zoom in over here so we can see the the text better we already created a project previously during the course so I'm going to work through this a little bit more quickly Source language English and let's make the target language Spanish in this case okay we're going to make the Spanish and then we're going to actually create the project freeo cam Integrations demo public project I already have one private project so I cannot create more projects because I have the free plan I activated the free plan after the trial so I'm going to make this public by default okay this option will be great out then I create the project of course we can always change these settings now now we see that we can add files for translation to this project but we're going to do that through an integration when we have our project over here like we saw before we can go to the Integrations Tab and with a free plan we can add one integration how can we do that we go here to this button add integration there are hundreds of Integrations that you can choose from it's very important to choose the right one because on the free plan you can only use one at a time so for this this example I'm going to show you something that is very commonly used like Google Drive we're going to use the Google Drive integration so you can Import and Export files directly to your drive folders that you can use with your Google account if we click on the integration we will go to the description page where you can find an overview the features at a quick lens you can also find usually like a tutorial recorded by crowding and how to set it up you can Import and Export trans translations manually but it just takes a few clicks so we will see how to do that in just a moment it's free so we just need to click here on install and we will install it install if we install this application Google Drive the application will have access to our projects and it will be displayed in the project menu Integrations Google Drive select the users that will be able to use this app you can choose if only you will have access to this app all project members or you can also select specific users if you had more users here you would see a list you can select them and you can filter them then you would click on select or cancel for now let's select only me then select the projects where users will be able to use the app projects you own or selected projects this will allow you to use this integration in all the projects you own or you can also select specific projects let's just select the free cocam Integrations demo because we don't want want access to this in the project demo so let's select this selected projects and then we install it let's install it like this and we see a confirmation message installed awesome right then of course we can click here again if we need to uninstall it at any time after that we have it installed let's go back now if we go back to the overview of the apps and Integrations now we see that it is installed because we see this install button awesome so after that we just click on the X icon and if we refresh we should see our integration over here in the Integrations tab Google Drive if we click on details we can see this over here this will prompt us to log in with Google drive here I'm working with a demo email a Gmail account so I'm going to log in with Google drive after that I select the email that I want to link I click here and then I see that crowding integration wants access to my Google account when you allow this access crowding integration will be able to see edit create and delete all of your Google drive files so make sure that you are granting this permission knowing what the application can do on your account okay make sure you trust this integration and then continue after you have the integration set up you will see this it's a actually quite easy you will see the content of your drive here I have a folder that I created on my drive manually and if I expand this I see the welcome to Free code cam PDF file I can just select this file if I want to translate it on my project and then select sync to crowding after I click on sync to crowding it might take a few seconds to actually sync to my crowding account you will see like this loading animation you can also select all the files of a folder by selecting that folder and voila here we have the content on crowding select content for synchronization to Google Drive this is like a back and forth process we first select the files on Google Drive then we sync that to crowding and then once we have the translation we will sync it back to Google Drive and we will have the translated version let's see how you can do that but first let's also check out these options that we have at the top we can see error Logs with the most recent error logs for this application right now we don't have any because we just installed it here we have the settings if we want to schedule synchronization for pushing sources and translations we can push sources and translations every hour every 3 hours 6 hours 12 hours or 24 hours and we can also show shared with me files from our drive if we don't want to show files that have been shared with us on our Google Drive account then we just disable this and then we can save and close this if we ever need to log out we can do that and log back in with a different Google account with a different Gmail great so now we have this on crowding and we can see we expand the folder and the file we can see that we are going to translate it into Spanish because this is our target language if we go back to our project and we check on sources now we see a folder that says Google Drive integration demo welcome to Free code cam we see the file over here in our sources Tab and if we go to our dashboard we will see Spanish as a target language and then we will see this the file ready to be translated if again we double click on this file we will go to the translation editor where we can start translating let's translate this first string again this is how we translated it before so I'm going to select this option and save the translation and then we are going to select this translation memory string again and then we are going to save it we're just going to translate the first two strings of this file so you know how this works remember we already saw all the different details of this translation editor so you should be familiar with these details you can continue translating the file but I'm going to show you how you can synchronize this back to your Google Drive we will have the first two strings in Spanish after we have that saved we can go back by clicking on the arrow and then we see that we are getting some progress on the translation 7% awesome right but we want to synchronize that to our Google Drive we go to Integrations details and then we can sync it manually or we can set the synchronization time like we saw before in the settings to a specific number of hours if we want to do that manually we go here to synchronize it and then we synchronize it we can either choose to synchronize the entire folder the file in all the languages or synchronize a specific language let's choose Spanish here and and then when we select the file and the language we can click here on sync to Google Drive If We sync this to Google Drive let's see what happens again we may need to wait for a few seconds until this is synchronized and we see that the file was exported successfully what happens now well let's see if I go to Google Drive now I see this welcome to Free code camp with the Spanish letter code the the two letter code and I see that it is in a doc X format because remember that crowding converts the file formats when we're working with PDF into a format that is easier to edit and work with with individual strings so if we double click on it we will be able to open it in Google Docs and we see the translation we see the first string translated and we see the second string translated awesome right crowding added this language code to differentiate the files automatically so if we have multiple languages we will have different files with their corresponding language codes we can do all of this manually like we just did or remember if you go to settings you can set the synchronization schedule to an hour 3 hours 6 hours 12 hours or 24 hours if you're translating your files gradually step by step or with multiple team members you can synchronize all of those changes to Google Drive that is an example of an integration that can be very helpful in crowding we have many many different Integrations in the next section I'm going to show you some of them so you have an idea of the kinds of things that you can do with this amazing Integrations feature now that you know how to actually install and use the integration let's see how you can uninstall it if you click here on details first I would suggest logging out here where you can log out of your account by clicking on log out and then it's just the same process for logging in again with your Google Drive just like we did a few minutes ago and then if you go to add integration you can choose here to uninstall it let's uninstall it and see what happens we see are you sure you want to uninstall Google Drive application well you can uninstall it like this and we see uninstalled successfully if we refresh this page then we don't see any Integrations and again we can always install a new one there are tons of free options to choose from if you want to filter the the Integrations by a specific criteria you can do that by category features CMS marketing e-commerce development specifically this is very helpful for development if we are translating a website like we are going to do in just a few minutes we can add the GitHub integration gitlab bitbucket in addition to the Integrations and apps you will also find guides over here and others that are tagged with system come over here so there are different types of resources combined in this very helpful you can also filter by author by tag search for a specific Apple integration filter by category sort by relevance sort by name sort by date published and you can always reverse the order great so let's go into the next section where we will take a look at some of the apps and Integrations that I think would be most helpful for you if you planning to translate your files or your website if you're working on development I will see you in the next section and then we will start working with the GitHub integration and working with other Integrations to actually translate your website so I will see you in the next part first we will take a look at the Integrations that you can use so let's go there let's dive in before we dive into other specific Integrations like the GitHub integration and the the visual studio code extension I'm going to show you some of the Integrations that I personally think would be most helpful for you as an organization or as a representative of an open source project or an educational project first of all of course we find the GitHub integration over here if you click on the integration you can find more details about it like an overview and here you can find specific details like the permission it requires and how it will be registered so it is very helpful you may also find other tutorials by crowding and how to set it up specifically we will cover the GitHub integration and we will see the visual studio code extension they also have a visual studio code guide over here in the absent integration section over here a guide of how to use crowding for VSS code we will see that step by step with a sample react app then we also find other tools that you may find helpful like Google Sheets integration if you're working with Google Sheets to create your glossies or to translate content that you're storing on a Google sheet you can also install this free beta integration right now it's in beta it's in in testing in a testing phase but when you're watching this video this may be out of beta so it might be more stable you can install it by clicking here to synchronize multi-link Google spreadsheets if you're storing your files in other services like Dropbox you can also install this free integration the Dropbox integration to localize your files like we did with Google Drive and since artificial intelligence is increasingly becoming more important in every area of development and translation crowding also included an AI assistant CH GPT Gemini to take your localization to the next level right now it's a free integration it's in beta and you can install it by clicking on this button you can find more details about it and how it works here in the overview another integration that I would suggest checking out is the suggestions diff Checker this integration Compares two translations and sees the differences between them so this is an integration that's especially helpful for proof readers and for translators that compares two two translations and shows the differences between them so that can be helpful because sometimes when we are checking the translations we may miss small details and this just highlights everything better it's a free integration that you can install with this button remember that with the free plan you can only use one integration at a time so make sure to choose that carefully but they are all really nice we also have a glosser editor we can add and change the terms from your glossies directly from the crowding editor if we in install this integration it's also free we can install it like this we can just edit the terms directly from the crowding editor without having to go to the glossery tab that can be helpful to save your time and if you're an organization that's also sharing educational or free content through video resources you may find these two Integrations super helpful you just write here captions and you will see this extension video captions Translator translate captions titles and descriptions from YouTube videos video captions localization with crowding you have the tutorial over here and you can learn how to set it up but it's always very easy they're usually very similar to what we just did with Google Drive they just have different purposes and that's also very helpful to synchronize the files automatically and I would personally suggest if you're working with video using this integration video preview this is an integration that lets you preview the video that you're translating when when you're translating the subtitles for additional context this is always very helpful if you watch the video when you're actually translating the subtitles or the or the captions so these are some of my personal suggestions for apps and Integrations I had an overview of the Integrations and these are the three ones that I do think would be worth it for any type of project specifically the last two if you're working with video but there are hundreds to choose from and many of them are free so take advantage of that you can use the one integration with the free plan if you're working on mobile development you also have Android Studio A plugin for Android studio and many more congratulations on reaching this part of the course it's great to have you here and now we're going to dive into the crowding Enterprise features why crowding Enterprise well because that's the plan that open-source projects and educational projects get for free with crowding first let's start with the basics let's start with how you can actually get a free license from crowding if you are an open- source project an educational project let's see if you go to crowding docomo here to pricing and you quickly scroll down to the bottom and you reach the frequently asked questions you can see here at the the bottom do you have plans for open- Source projects and educational institutions yes they do have them so if you want to use crowding for an open source project you can sign up for a free account set up your project and then send them a request they will grant you the license you can also apply for an academic license if your project has educational purposes each granted license will include an unlimited number of projects strings and members here you have the links for requesting that license after you set up your project and you follow all the steps that we saw in the previous part of the course for that you will need to choose either open source or academic license for either one of them you can open them and here you will see if you are an open source project the setup request form crowding is completely free of charge for open- Source projects before submitting this form and where you will request the license you will need to ensure that your project meets the following criteria here you have the list this may change as this may be different when you're watching this course but initially you have to create a translation project in crowding the project that you are currently owning the open- source project has to be licensed under an approved license from an open source initiative your Project's source code has to be publicly available for download you do not have any commercial products related to the open source project that you are requesting a license for you are the Project Lead so remember this you have to be the project lead to actually request this license and submit the form you have been working on your open source project for at least 3 months you must have an active community of collaborators you keep the news section of your website up to date and you release updated Builds on a regular basis so it's not like a project that you just released once and then you don't update anymore it has to be updated on a regular basis please note that as an open- source project maintainer by submitting the form you are agreeing to join the crowding beta group so you will test the latest features and you will also contribute your project translations to the crowding Global translation memory to gain access to crowding neural machine translator this is the form that you have to submit the project name project license project website URL describe your project in as much detail as possible your email your name your crowding username and your crowding organization name specifically for crowding Enterprise if you're currently on a trial all your information is kept secure and protected so after that you just submit your request and the crowding team will contact you that is for an open source project but what about academic projects you just go here to the second form and you will see a form that is very similar with some differences this is an academic license project setup request form they are intended for educational purposes only they can only be registered with the educational email address of your institution they must match a school's domain name here you can see the different features you can have open or private open licenses are provided for Public Access projects and private licenses allow you to limit project access due to confidentiality so you can choose between an open license or a private license and here you can see the differences in the features the most important one is that here you have private projects if you choose private the open license does not have private projects open licenses are completely free of charge here you can see the form the name of your educational institution your project name project type it can either be open or private describe your project in as much detail as possible your email your name and your crowding username then you submit your request with this form this is how you can get a license if you're representing if you're the Project Lead of an open source project or an educational institution awesome so after you have your license let's see how you can actually create an organization in crowding with crowding Enterprise this is more advanced and the crowding domcom account that we have been working with it has more features and it's usually used for large organizations or teams that will be working with many team members or using the power of crowdsourcing by engaging collaborators to create an organization you just need to go to here login or sign up if you click here on sign up you will go to where you can actually sign up for an account but by default crowding dcom will be selected this is like the basic account that we have been working with so far when you get a license as an organization you will be able to create a an organization through crowding Enterprise that has more advanced features and you can also try it for free for 30 days to see if the features match what your organization needs to sign up to create the organization we see this short form the organization name you will need to choose an organization name that will end with doing.com in our case we have an organization called freec codam course demo. crowding if you go to that URL you will be able to check your organization then you need to enter your work email that's usually an email granted by the organization or the project then your username and your password after that okay check this check box to agree to the terms and conditions and the privacy policy you will also see a verification from cloudflare and if you click here you can create an organization I already have my organization created so I will click here on enter an existing organization to enter an existing organization you just need to enter your organization's URL in my case that would be freec codom course demo. crowding dcom it's very important to write the name with dashes okay if you forgot the URL if you click here you can find your organization with your email they will send you a confirmation email and find existing organizations you've joined or can join but for now since we are just logging in we are going to enter our organization's URL then you will see this the name of your organization then here you will enter the email or username that you used when you created that organization and then your password if you don't want to use your password and that's usually what I do I can click here on the magic link option it's super helpful it will send you a link to your email and you may also need to enter a second verification code but it's helpful because you don't have to actually remember the password you can either click here on login if you enter the password or click here on Magic link I'm going to show you magic link because it's very helpful and I love this picture just see your email here confirm that it's your email the one that you entered before you can also choose if you want to stay logged in then send magic link you will get a magic link on your email and you will be able to click on a login link that will open crowding on a different different tub and this is what you will see when you enter your organization account it's very very similar to the crowding decom account but it does have a few more advanced features when you get the full license as an organization but we will go through that and you will see the similarities and differences in just a moment over here the first thing that you can see is the sidebar it's located to the left the first section is the workspace where you will see your projects or groups groups are like folders that you can use to categorize all the different projects of your organization a project is the set of files that you're going to translate for a specific project of your organization but a group is a way to group your projects we will create a project and a group in just a moment for now let's just have a quick tour of these options because you will find them very familiar if you already watch the previous part of the course then after workspace we find start projects if you have many different projects and you want to just select your favorite ones or your most used ones or the ones you're actively working on then you can click on the start icon in the project start them and find them all here that's very helpful if you have many projects then here you can find notifications you will see a history of all the notifications as like in a timeline and you can mark them as red red or un red you can also find archived notifications and you can filter them you can show all notifications just unresolved issues or notifications without a reply here you can also Mark all your notifications as red but I already did that here so that's why this is gray out but you should have this enabled if you have unread notifications then after that we find the messages messages is where you can create conversations remember conversations from crowding decom yes it's basically the same with crowding Enterprise you can start a conversation with individuals or invite multiple members you can search for members by their name username or email so here you can enter a username and an email and you will find your member and start a new conversation here we also find tasks tasks here work a little bit different because in the general view of this organization tasks are like shown globally you can create tasks within specific projects and they will all appear here you can also assign specific people to each workflow step and enable project notifications to avoid creating tasks but that is something very specific it's outside of the scope of this course you may dive into this if you don't want to create tasks for specific team members remember we create the task directly within the projects and they will all appear here because we're not actually with in a specific project we're within the organization's account that's something that you should keep in mind when you're in this main dashboard great that's the first category of tools and then we find more advanced tools that we have seen in the previous hours of the course here we find managers I created the organization so I am the owner I am a manager here it shows when I joined and the teams I belong to I can also search for specific managers here if I have many different managers in my organization and I can go to different pages and choose how many rows I want to see per page that's great I can add Managers from here you will see this helpful description on the bottom right and you can either click on got it learn more or actually use that additional tool here we can add a manager and adding a manager is very similar to what we did in crowding dcom you just need to enter the name username or email here and you will be adding a manager then you click on done and that's it you will be adding a manager for a specific subgroup or project then we find workflow templates we have not really covered workflows during the course because this is something that is more oriented towards Enterprise accounts and organizational accounts they're basically a sequence of steps that um the content of your project should go through when you start your project like like translation proof reading and quality assurance all the different steps that you would follow in a translation process here you can find some workflow templates that you can start with that you can edit and customize to your needs if you need to search for a specific workflow you can always search it over here and you can sort them by their name or by the date that we modified you can also reverse the order over here and change this to list view if you don't like the grid view I personally like the grid view because it's more Visual and I can actually see the workflow here they do have some similarities with flowcharts because they describe a process and a sequence of steps if we click here on let's say crowdsourcing because that is an example of what a nonprofit organization like an open source project would usually use crowd sourcing remember is the practice of engaging your community in the translation process so if we click on it we will enter like the the workflow editor and we will be able to customize each step let's have a quick overview of this so you can understand this better this is the workflow you can if if you click on the left Mouse button you drag it you can also zoom in and zoom out with these controls here at the bottom left and you can click on each individual node over here in the workflow to learn more about how it's being configured for example how can we read this workflow we start here we start the process and then we see that the strings are on translated then they go through a process of translation memory pre- transation here we see that we need to select the target language so it does need some specific setup or configuration to start the process Auto substitution of 100% match for the translation memory so the automated suggestions have to be a 100% match to actually translate it then the strings that are unrated go to the crowdsourcing phase here we can see more details about this phase engage your community in the localization process collaborate with volunteer translators and reward their efforts in a way that works for both of you all projects with this workflow step will be publicly accessible and translation resources will be shared with all volunteers registered in your organization ation so you can see that we have some description of these steps and Below them we have some settings that we can configure but for that we need to edit the workflow and we will do that in just a moment finally here we see proof reading and once the strings are approved because everything is translated you can see here we have translated strings then we just need to approve it then the strings are approved and the process ends since we don't have any Target languages yes we need to select a target language this is the basic crowd sourcing workflow we have other templates let's see how you can edit the workflow on the left side barar when we edit the workflow we see many different steps that we can add to this diagram and we just need to drag and drop them like this let's say that I want to add an extra Pro reading I can just drag it onto this area and I need to connect it with the previous node in the process so let's say that I want to have a second prove reading phase I am very very careful with my translations and I want the team to have a second proof reading phase what do I do well I just disconnect these two notes and then I take this node I click here at the bottom you will see a plus sign and I connect it over here creating this flow once the strings have been approved I just take this at the bottom and voila I connected with the end like this and I can readjust the location of the noes or the the different steps in the process over here in the diagram and I can also configure it so let's say that the output of this pH will be an approved string so that is already marked by default because it's a proof reading note and the output could also be approved by the assigned user and that would change the output of that node we can select specific languages for the output of that node or what the that phas will involve Great that is a proof reading step but we have many different types of steps we have Source text review custom code switch Source language translation memory pre- transation machine translation pre- transation translation translation by a vendor translation by apis proof reading and prove reading by vendor those are all the steps that we have right now and since we're already using the crowdsourcing step we see that it is great out because only one crowdsourcing step can be added to a workflow so they do have some limitations based on the logic of the step let's see how for example we can configure this translation memory pre- transation we can select the language we can turn on or off the auto substitution or we can use project settings and we can also set the minimum match ratio how good should the match be for the translation memory to actually assign a translation to the string in this case we're saying that it has to be a 100% match but we could decrement this number so we can actually find a match that fits our needs or we can also ask the match to be perfect to actually translate the string before the crowd sourcing step and in this case I would suggest keeping this off but you can automatically approve added translations you can choose to approve the added translations if they are a perfect match you can approve all of them which is it's always recommended to actually have someone reviewing that translation before it goes live in your project because it is automatically generated or it is selected from a database of previous translations that may not be appropriate for specific context so it's always great to have a pro reading phase before approving them but with perfect match with perfect match but approved previously or you can also replace all but skip Autos substituted translations so these are the settings that you can customize after you have your workflow ready you can choose to save it you can also undo or redo the changes you can find more information here in this question mark and if we see the tips we see drag workflow steps to the working area to get started that's exactly what we did right now we can drag the workflow steps we can set the connection between all the selected steps we can select the target languages and configure step settings to make each step work you need to set it up click on the steps one by one to Define Target languages and other specific settings workflow configuration is almost done so you can click save if all the steps are correct and if all the steps are connected to each each other like this and over here in the gear icon you can see the workflow settings you can change the name of the workflow you can change the description the template already has a description that you can customize and you can also choose don't center the selected workflow step when editing you can enable or disable this and after that you can save your workflow by clicking here that's basically the workflow editor and you can customize this to fit the needs of your organization here if we go back to the workflow templates in our organization we go back and we can see additional options over here in the templates if we click here on the information button we will see the name of the workflow and the description so we can see more about the workflow before we actually enter the workflow editor and if we click on the ellipses we can preview the template if we preview the template we see it over here and then we can click on edit we can also go back we can edit it directly we can duplicate it and we can delete it if you want to customize a template but you don't actually want to change the template itself then you can duplicate it and then customize it to your liking and you can also delete it another option would be to create a new workflow from scratch if you want to do that then you just need to click here on Create and then you can create a new workflow template projects within an organization can share the same workflow template or have different ones each step can be assigned to different people and include different languages so we are creating a new workflow template because over here all the workflows that we have are templates that we can assign to multiple projects so we can create our workflow once and reuse it as many times as we need to we are writing the name of the workflow and the description once we have that we just click on Create and that will create our workflow we can assign it to the projects we need awesome now you know how to work with workflows so let's continue with these options you will find them very familiar because they are familiar we saw them previously the translation memories we don't have any yet because we haven't created a project but here you will find your translation memories your glossies and your machine translation the translation memories can be created over here with a create button and if you create a new translation memory you will need to enter the name the language and you can drag files here or you can select files from your file system if you want to actually upload a file with the source strings and their translations into different languages this can help you to speed up the translation like we did in crowding dcom the glossaries can also be created here with the create button new you you just write a new name you assign a name you select the language of the glossery and you can also drag glossery files over here machine translation has a few different options by default here you can see crowding translate the engine is crowding translate and it supports 24 language pairs you can see them over here English to all of these languages French to English and Chinese simplified to English and Japanese so you can check if the language pair that you're looking for is available here on crowding translate for the machine translation process if you click on this ellipses you can edit the machine translation clear cache or delete and you can change the view by clicking here on select columns if you want to show all of these columns just check them if you want to hide any of them just uncheck them and you can customize the user interface to fit your needs this way you can also hide everything or show everything over here with all selected great and you can also over here we go to the bottom right you can add a machine translation engine you will see it added over here below as a second entry here to add a machine translation engine you can use an existing integration or a custom integration and here you can select the engine Google translate Microsoft translator Amazon translate then you assign a name to your translation engine and you select the applicable languages you can leave it empty for access to all languages and you can enable the machine translation in specific projects here you would be able to select your project you can leave it empty to enable it in all the projects after you have all of this set up or if you want to set up a custom integration you can do that and then click on Create and you will have your new machine transation engine that's for machine translation if you want to go to reports then you click here on reports and you will see basically all the information that we had in crowd.com in a different view or presentation the organization overview number of words languages the percentage of strings that have been translated by users translation memory machine translation we have unresolved issues quality assurance issues we have charts different charts and graphs of the proof reading and translation activity so you can have a a bird side view a general overview of everything that is happening in your project and you can keep a close track on your theme it can be super helpful remember that you can change this to show you for example a number of words number of strings characters or characters with spaces so you can get as granular as you need for your organization and you can also expand the range the the time range of the summary from 30 days to 24 hours to last year or you can narrow it down to the last week depending on the data that you actually need to analyze they're very very helpful and in this with this option the purple option you can also generate a list of translators based on a specific period of time to see who contributed the most to your Project's translation if you click here on generate you will get a list of your Top members that's always helpful to know who has contributed the most to your project after that we find here the store which is an interesting area of the organization because it's already incorporated into the organization if we click here we will see all the different applications that are available in crowding if you see this little arrow here that means that the extension is free to download or free to incorporate into your projects and they do have many many different applications in their store you can filter them by author by specific authors you can filter them by tax those are the two options author and tax you can also search for them in the search bar you can filter by categories and by relevance by name by date publish so basically you have many different options to find exactly what you need and additionally you can also reverse the order over here we also find something very interesting if you want extra quality assurance checks you can go here to QA check templates and you can add them to your project like colors mismatch date format consistency find duplicate words Emoji mismatch extra phone number forbidden characters it's just great to know that we have all of these extra quality assurance features that make the translation process a lot easier so I recommend checking this if you are representing an organization it will help you and your contributors a lot it will save you a lot of time and finally we reach user management user management is where you can manage users and teams I can see a summary of all my users when I joined when I last saw the project my name username the permissions I have and I can select my row and perform other operations on me like on that user which is really me but it could be any user that belongs to my organization I can edit the user first name last name pronouns time zone and the email and I can also view the user crowding is currently working on a feature that is coming soon working on so you can expect this feature to be available perhaps when you're watching this video it seems like it will show you the test that the user is currently working on so that's great I'm looking forward to that feature from the bottom right you can also invite users if you want to invite people to your organization you can use their emails you can send multiple emails just separate the addresses with commas so if you write the emails here like sample gmail.com and demog gmail.com you will going see that I'm adding all these emails and I can also remove them here by clicking on the X if I click here on this button send invite I will be sending the invites to those emails and they will be able to join my organization now that we covered all the tools that we have here on the left sidebar let's go to the settings because in crowding Enterprise we also have settings that we can customize just like in crowding dcom we will go through them real quick first we're going to start with the account settings and then the organization settings for the account settings we can see our personal information like Photo first name last name pronouns the platform language we can change this to English or Chinese simplified our username and our email then we have security features like the authenticator app connected applications device verification they have many different ways to keep your projects safe then we have notifications we can configure if we want to get inapp notifications or email notifications or custom notifications basically we can get notifications for many different things like collaboration Integrations new strings language progress content issues it's really great to know that we can customize this to fit our needs exactly I encourage you to go through all of them and check what you would like to enable or disable from the notifications panel and over here we can also find personal access tokens that we may use with accounting API command line interface and some of the Integrations and plugins they may ask for personal access tokens you can generate a new token over here clicking on this button and that's the account settings in Enterprise if we go to organization settings over here we find even more settings that we can customize we have the name of the organization we can change that the logo public organizations this section is unlocked when the organization has at least one public project a public project in crowding is a project that has has a crowdsourcing step in its workflow remember we just talked about workflows and we had a crowdsourcing step so we have to have that step to enable these settings public description default public project View and featured projects free Cod cam is an example of a public organization you can see this over here we have this view we have different projects and we also have the name and we can have a description here in about and finally we see a custom domain you can enter the custom domain over here and save it then we see authentication we see different apps that we can install from the store and we can also install private apps custom QA checks what we just saw that we can add from the store we can configure web hooks custom languages custom placeholders and much more like security logs and legal and compliance but that's beyond the scope of what we're trying to do over here those are all the settings that we can configure if we go back to the workspace now let's go through these options that we have here we have the search bar where we can search for projects if we have many different projects they will appear here and you will be able to filter them to find them quickly here we can see notifications over here we can go to conversations it's the same as clicking here and here we can find more information like support help center community cookies keyboard shortcuts and what's new you may see some differences between what I am showing you right now and the state of crowding Enterprise when you take the course but they will be small updates or additions or modifications but overall the functionality should be basically the same great now you know the basics of the crowding Enterprise user interface so we're going to create a project in in in crowding Enterprise to show you how it works and how we can also create groups to group your projects by category so I will see you in in the next section to continue with this topic let's say that I I'm representing an organization and I'm creating the project in my organization's account how can I do that how can I start a new project we're going to be looking at how this works with a basic example the PDF file that we worked within the previous sections of the course but this process will apply to projects of any complexity okay I'm just using the PDF file to show you all the basics if we click here on create on this button here at the bottom right we will see two options we can either create a project or create a group what's the difference between a project and a group a project is a set of files that we are used to working with but a group is like one level above the concept of a project because it's like a folder that organizes related projects on under the same area or space in the workspace if we create a group we can also create subgroups groups within groups of projects and that's very helpful to organize our projects because they can share resources within the same group we can share translation memories we can share glossaries we can share Machine translation engines and workflows so creating groups and organizing your projects like this can save you your contrib rors and your team a lot of time so let's create a group let me show you how we can create a group new group let's name this Android let's say that we are an organization and we are developing an Android app like free codam has its own Android app if we are planning to have multiple projects for Android then we can create a group named Android and then we click here on create group if we create that group we can see it right here Android the group is empty but now we see the workspace we can filter our groups and projects by their visibility by public and private projects by their translation status and by the workflow status we can also filter by their name and sort them by their name by when they were added by their last activity and we can switch between list and grid view but I personally prefer the GD view so I recommend it but it's really up to you if we click here on the group we will be inside the group inside the Android group we can see it here within our workspace and currently we have no projects in this group all projects that we add to the group will appear over here just to show you how this works with multiple groups let's create another group let's say web for all our web application projects create group web and let's create another group iOS let's say that we are developing an app an app for Android and for iOS and we also have a web version like fre codam so we have three groups here that are all empty right now if we go into the groups we will see them over here we see the overall workspace structure and if we click here we can go from one group to another without actually returning to the main workspace this is quicker and it can save you a lot of time awesome so you know what a group is you know how to create it so let's actually create a project let's create a project in crowding Enterprise for your organization to create a project you click here on Create and then you can choose if you want to create a project or a group a group is like a set of projects here we created the groups Android web and iOS right now these groups are empty but we can always add new projects to them let's select project here and let's see what we need to choose and customize we need to customize the name so let's name this freeo cam tutorial the project languages are going to be Source language English and target language again we see the same list of languages that we are familiar with from previous steps and we can choose Spanish let's say that we are going to choose Japanese Bengali Hindi and French just to add a a few Target languages for our project but we will be mainly working with Spanish like always we can always click here on the X if we want to remove that language selected from the list then we can also click on clear we can create custom languages or we can prefill the list with the top 30 languages on crowding we have all of these options then optionally we can choose a workflow by default you will see the in-house translators workflow but but you can remove this with the X and you will be able to set up a workflow later you don't have to do that at this particular step and you can see all the four templates that you already have predefined let's say that we choose a crowdsourcing workflow just as a example because if you're representing an open source project or a nonprofit organization you will be working with crowdsourcing so let's see how this works we can also enable this delay workflow start delayed workflow start allows you to upload existing translations and resources like translation memory or glossies even before the project becomes available for translation so if you want to upload any existing resources to your project just enable this okay for now we're going to keep this disabled and then we create our project and here we can see our project in crowding Enterprise it's a bit different than what we saw in crowd.com but the functionality is essentially very similar let's go through the main aspects of this first here we find the name of our project and we can search for projects if our organization has multiple projects we can also star our project if this is a project that will be used very frequently we can start it here by clicking on the start and you will see it in the start projects in your organization that's helpful if you want to keep track of the projects that you're currently working work on or your most popular projects so that's like a quick way to have them at hand here you can see that we have the crowdsourcing workflow five Target languages zero Source words because we haven't uploaded any resources yet and the last activity was a few seconds ago we can change our project's logo in the settings that's always helpful to create a friendlier tone for the organization and for your volunteers and contributors first here we we find the dashboard in the dashboard we find our Target languages with a very similar user interface that we had before we have the translation and approval percentages we can see a more detailed breakdown of the different steps of our crowdsourcing workflow that we chose we see this automatic step we have the crowd sourcing step and we have the proof reading step and we can go to the editor very quickly or we can close this for every individual language if we click on the language we go to that particular language and here we would see the source files if we go to the details we can see all the managers and if we have any members project members we will also see them here we see their role the project ID when it was created The Source language we can change that by clicking on the gear icon and then choosing the language again we can change that over here if we need to and we see how many project members we have we also have the option to upload download or pre- translate right now our workflow in the second tab here in the second step we see the workflow scheme here we can see that we have the same workflow that we had for crowdsourcing before but now instead of being a template it's actually customized to our project because now we do have Target languages selected Bengali French Hindi Japanese and Spanish so instead of being just a template now we do have specific translated languages and here if we click on crowdsourcing we also see a special page this is your crowdsourcing settings page here you can configure the appearance of your project on the public page what your volunteers will see set up branding and build a community by sharing an invitation link on your website or social media that's basically what fream does for our community once confirmed publish your project to make it visible on your organization's public page if we go to free code camp we can see that this is the translation page for our Organization for free code cam we see the feature projects all the projects we see an about page and we can also share links to our organization on our website so basically this is what free Cen has configured we can customize our logo by uploading a new logo here change the public project name use a catchy title to inspire your contributors then we see the public project identifier the public project URL how people are going to be able to reach your public project and your description this is optional you can also choose a custom domain if you click here you will go to this part of the settings where you can set up your custom domain your organization settings now if we go back to the project now we know what workflow is we know the crowdsourcing step in the crowdsourcing step we also see the readme we can edit the readme with the markdown format add links quotes and images everything to get your community excited about this new project that they can contribute to you can also activate gamification but that feature is coming soon it seems like it's going to be a great feature you can activate reward system to encourage contributors that's a very interesting feature I'm looking forward to seeing it might be enabled by the time you watching this video so make sure to try that for encouraging your community then you can also see the status image this is something that you can embed in your projects read me the localization status this one right here the general documentation or any other service for that you use for the project like GitHub this is a preview of your status image it will show the percentage of the translation of your project you can embed that status icon with this line of a markdown here for HTML this line of markdown for a your readme or markdown file and you can also share this image URL you can copy it by clicking on this button and it will be copied to your clipboard you can also invite a developer if you need help with any of these steps another thing that is very helpful for crowdsourcing is assigning proof readers and manager roles proof readers and managers participate in discussions they help you find the best translations and basically organize the localization community so you can invite people here and you will be inviting them to contribute to this particular project and finally we see building Community direct link this is a link that you can use to invite people to your crowdsourcing project you can share it directly on your website or send it via email it's great out but you can copy it here and it will be copied to your clipboard please read the privacy policy notice so you know everything that crowding is sharing with you here about the privacy policy when you share this link and here we can also see a website pop up you can see the crowding is thinking about everything that can be helpful to engage the community for these types of crowdsourcing projects you can also add the website popup the crowding web widget encourage visitors to your website to contribute to the translations the this widget allows browsing visitors to translate and vote for Strings shown in a Rand order directly on your website this way more people can contribute to your Project's translation you can enable translations via the web widget over here if you click on it and you can add this this JavaScript snippet to your website Pages where the widget should be displayed you just copy it right before the closing body tag and you will see the widget where people can contribute please note that each person who clicks on the widget must choose from the list of all the project Target languages be for contributing if you want to skip the step predefine the target language at the beginning by adding the language code to the snippet members will also be able to change the language in the widget settings this is an example of what a snippet with a French predefined language would look like here we can see this data language code we can see F FR which is the twetter code for the French language so that's very interesting and I highly suggest diving into these Ops because they can be super helpful for engaging your community especially this feature that is coming soon the gamification system to reward your contributors great so after we know about that let's go to sources here we find files and strings files is where you can upload your files it's very similar to what we saw in crow.com but we have a few option a few different options here we see upload files from the device from your device you can also upload zip archives you can use samples from crowding to explore how the platform works you can set up Integrations with your repository or other supported systems like we did before and you can invite developers to help you with the project setup currently we have no files to translate but I'm going to upload our welcome to Free code cam sample file just as a test upload file welcome to Free code cam it's uploading the file it's uploading the file and you may need to wait for a few seconds while it's being uploaded and also remember that this has to be converted into individual strings so it might take a few minutes or a few seconds while it's being processed also since it's a PDF file it will be converted into either HTML or dogx files it's automatically converted so now we close it and if we double click on it we see a preview of the file over here if we click on these three small while the in the ellipses we see all of these options preview opening editor settings download Source view progress view strings update move rename and delete basically the Bas the essential functionality that you would need for any file and I'm showing you this with a basic doca or a PDF file because the functionality will be exactly the same for projects of any size or complexity okay so I'm focusing here on the basics to be as general as possible so you can understand how this works and apply it to any project that you're working with let's select this file and let's see what we get here on the right sidebar we see the details the number of strings number of words when it was last updated we can preserve folder hierarchy for export that is also important if we want to keep that hierarchy when we export the files we can click here we can also download the translations for selected languages and we have a history of revisions made to the file we have 24 strings added none of them were updated and none of them were removed at this point then you will see like a timeline a vertical timeline being created as you work on the file great revisions one and you will be taken to that timeline you will see all the different revisions of your file with this Arrow you can also set the priority right now it says medium priority if we click on it again it will turn red and it will have a high high priority or right now if we click on it again it will go to a low priority so you can help your translators choose what to translate first by giving them this particular priority great over here we also find the search bar we find an option where we can create a branch if we're working with Version Control Systems like GID and we want to create different branches we can also create folders and we can add new files we can upload them we can create strings Vault or we can set up an integration to upload them or import them automatically through an integration now if we go to Strings now we can see all the strings that we had from that particular file that we just uploaded we can see the key for that string the context and the source in English the text on the string so we have all this detail and for each individual string we can edit it we can hide it or we can assign a label to it we can manage labels if we click over here and assign labels to individual strings it goes to a very granular level this tool and how crowding presents the information we can filter strings because you can see that right now I only have one very simple file and I already have all of these strings for a real project this would have like thousands of rows or millions of rows potentially if you want to filter them you can filter them by strings with issues with comments with screen screenshots or with different visibility only the strings that are hidden or visible you can also search for them by the source string by the context or by anything you need to filter in this list you can edit the string that you currently have selected by selecting that string with the check mark over here and then clicking here on edit that's another way of editing that string you can also hide it or you can manage that String's labels these are like shortcuts to the options that you have over here we can also add a string add a source string ourselves if we need to if it's a string that is not in one of our source files here at the top we also see all files we can filter the strings by the files that we want to check for example if we had multiple files we could only show the strings for this particular file and here we can search for that file if we have hundreds of f files so we don't see all the strings here in an endless list of rows we can just go to the strings that we're interested in and over here we have an option called labels where we can manage the labels that we can assign to specific strings we create a label and then we can assign it to a string very easily with this option label ass let me show you how to create a label we go to labels then let's say that this we want to create a label that says that the string is important let's say we save it now we have that label we can edit it or delete it and now if we go back to sources strings and we select a specific string we are going to label it as important we mark it we check it and then we apply it like this and now that's string will be marked as important for that label it's a great feature if you want to categorize your strings great so after that we go to the next category translations where we can upload existing translations if we have them download them as zip it's very similar to what we saw in crown.com this one is really very similar you can download all languages or specific languages this will be languages from your target languages for that particular Pro project Target file bundles that you can generate and you can have over thee a Content delivery but this is beyond the scope of the course this is more advanced if you want you can dive into this option you also have an option to preview translations as a CSP file and xlsx file or you can also preview them in the browser if you click on preview in the browser you will see like an overview of all the strings that you currently have and since we haven't translated them them they are just a repetition of what we had in English but when we translate them we will see them there then we find a screenshots that you can add and upload for additional context you just click here on upload you select your screenshot and then you can add that to your strings you can also create tasks for this particular project and it's important to remember that you are creating the tasks for that particular project when you go back to your crowding dashboard your organizations dashboard by clicking here on the crowding icon you will go back to your workspace this workspace has all the projects of your organization and if you go here to tasks this will show all the tasks of all the different projects in your organization it's like a combination of everything that you're working on all the tasks will be there but this is different from the tasks of an individual project when you're inside the project view this tasks will be the task for that particular project these tasks are for the project and the other tasks are in general for the organization so you will see all the tasks of all the projects in your workspace great so let's create a new task you can see that it's very similar to what we did in crowding dcom translate by your own translators by proof readers Source language the strings if you want to translate all the to-do strings or the strings that were modified IED in a specific time range you can filter them by labels for example if we have the important label here we can choose to translate all the important strings in that file or you can also exclude labels you can add a due date and selected from the calendar and this option is also very important to make sure that your team is working productively skip strings already included in other tasks if you select this you will be skipping the strings that have already been assigned to other team members so you will be avoiding any repetitive work then you can select the files that you want to assign the target languages like Spanish Japanese and then who is going to be assigned to that particular language I'm going to assign users for Spanish then I can select the user here and click on done I also have the option to split files and tell that user or that contributor how many words will be translated approximately so we are going to just disable this we're not going to split the file for now we're we're going to click on done then we see summary here and description here you can write a more detailed description of the task I'm going to assign myself to Spanish and Japanese so you can see that the same contributor can be assigned to multiple languages let's check this let's also add a we're not going to have any due dates for now we're just going to create the task and we're going to create it you can see that after you create your first task you will have like a the dashboard that we had before in crowding dcom where you can drag and drop your tasks and you will have one task per language here we have Japanese and here we have Spanish when the tasks are pending when they are not completed they will be in the to-do column then in progress and then they will be done you can also close the task it's basically essentially the same with a different presentation here very helpful to keep track of everything you have who created the task when it was created the current status you can open the task in the editor the percentage of completion of that task and who is assigned to that task you can also add comments here and start a discussion you can filter tasks as well with different criteria you can search for specific tasks Group by language and this is very very nice you can group tasks by language instead of seeing them like this in a board all of them combined you can group them by language so if you're looking for a task in Spanish just open this and you will see all the tasks that you currently have for Spanish and you can just reorder them and the effect will also be reflected if you change the view to the dashboard again like this it's very very helpful you can also see all the tasks for that particular project here in all tasks and you can choose to move to a different status to edit the task close it or delete it now we go to members and this is basically the same that we have been working with the member tab we have the members we know their their roles Here I Am the owner H when we gave them access if they belong to a team and here we can find more details about the user how many strings were translated approved voted or commented we can also remove members over here in the trash can and we can invite people if you want to invite people to that project this is similar and yet a bit different from what we did in crowding decom you can enter the users email username or team name you just need to write the email so let's say sample at gmail.com but don't worry I'm not going to send the invitation there and there I can assign the role manager develop ER Pro reader or language coordinator I can also just send the invitation without enabling any of these roles if I just want the contributor to be a translator but I can enable this if I want to okay manager developer if you want to give access to that contributor to the project as a proof reader you can enable this and if you click on this Arrow where you see all languages you can restrict the access because sometimes we don't want to assign a proof reader to all the languages we want to assign it to a particular language that we know he or she is proficient in right so we will disable this access to all the project languages and then we can select a specific language like Spanish and after we select that language we can select multiple languages like let's say Spanish and Japanese we can also restrict in the access of that particular proof Feer to the steps of our workflow if we want to assign that proof reader to all the steps in the workflow existing and a future we keep this by default but if we only want to assign that proof reader to specific steps we can do so by clicking here if we had multiple proof reading steps for example multiple faces of people checking the translations we could assign them to the first step for example or the second step and we could choose this very granularly to restrict the permissions as needed that is very helpful as well in crowding that we have the granularity in the permissions to avoid any misunderstandings or anything that could happen when you're working with a team of volunteers great so we're going to remove this proof reader access for now and you can see that with the language coordinator is exactly the same language coordinators can manage people and teams of the selected languages so they have a higher level in the hierarchy than proof readers when it comes to their permissions in the platform because proof readers can translate and proofread the content but language coordinators can also manage people and teams of their selected Languages by default you will see all languages like with proof readers but you can disable this and select a specific language let's say that I want this contributor to be a language coordinator for Bengali Japanese and Spanish I can just select these three languages and now I see that I will send an invitation for these three languages and if I instead of sending an email I want to get a sharable link I can also get a sharable link I click here and then I get the sharable link I can see that it expires in one week and I can change when it will expire if one week is too much for me then I can set it the the expiration to one day or 1 hour or if it's too little then I can set it to one month or I can set it to never expiring and just keep that invitation open as long as it needs to be if I click here on copy link I will be copying it to the H to the clipboard that's another way of sending the invitation this one will send the user an email with the invitation when you're ready and you have everything set up exactly like you want it to be you can send the invite you can invite multiple members at once you just need to add them here to the list and if you want to remove them you can just click on the X to remove them that's basically how you can invite people to your organization in crowding Enterprise when you're ready just click on invite I'm going to click here on Escape so we can go back to the project and again here we have our famous Integrations remember in crowding decom that we use the Google Drive integration well this works exactly the same in crowding Enterprise but here if you have the license for an open- source project and it educational project you will be able to add multiple Integrations that's basically the difference if you click here on add apps you will see the same basically the same view that we had before with all the applications from the crowding store there are hundreds stitches from and with a crowding Enterprise plan you can choose and install multiple Integrations at once here we also find reports because if you're going to manage an organization you will also need to view the reports and this reports H tab or this reports feature is different from the reports feature that we had here in the main workspace here remember that we also had reports in our main workspace this report is for the organization for the organization remember that we can have multiple projects per organization if we need to see a high level overview of the performance of our organization we can go here to the reports in our main workspace but if we need to check specific statistics about our project we go here to the reports tab or the report section of our project it's basically the same but the data will be specific for our project we can see the overview the the project size and we also get the Top members feature where we can have an export a report of our Top members which is always helpful to encourage your top contributors finally we can also see the activity here this is like a timeline of the changes or updates made to the project we see tools over here tools that you can work with like the crowding API the command line interface crowding and context and other helpful tools and here at the very bottom we find the settings you can customize a ton of settings there are many to choose from and customize like customizing the the Project logo project name you can also transfer ownership if you need to and you can delete your project but be very certain that you want to do this because it deleting the project at least cannot be undone you can also change the Privacy this is something very important this feature over here this is something that I really wanted to highlight because if you're planning to manage contributors and volunteers this will be helpful for you task based Access Control this means that your project member can work with tasks they are assigned to even if they do not have full access to the language basically what this does is that it allows you to create tasks and assign contributors to specific tasks without giving them access or full access to the language so they can work on the specific files they are working on they are assigned to but not on files they are not assigned to if you enable this that will limit contributors access to the overall project if you're translating for example articles for from your blog or you're translating specific parts of your website or your platform and you want to be able to assign contributors to specific files then you should enable this and create tasks and assign them to tasks this is something that we are adding to our workflow at free code camp and over here we see notifications you can enable notifications for translators when there are new strings to be trans ated you can notify project managers and developers about new strings and you can notify project managers and developers when a language has been completed when the translation or proof reading process have been completed that's always helpful you can change the source and Target languages you can also customize your quality assurance settings here you can disable but it will be enabled by default the QA checks they are always like helpful and you can change how many approvals are needed to clear the quality assurance checks one approval two approvals three four five approvals you have a maximum of five approvals in the quality assurance checks we can check for omissions translation length limit tax and basically everything we had in crowding decom as well and we can change if they errors or if they are warnings we can also set up custom quality assurance checks but we can add them in our organization settings if we want to add some custom quality assurance checks here we can also enable translation memories and customize them we can set up machine translations glossies we can customize settings for importing and exporting files I highly encourage you to go through these settings to know everything that you can customize in crowding including like the labels and this is a bit more advanced the parser configuration and finally file processor this has been a general overview of what you will find in your project when you start working on crowding Enterprise it's very similar to crowding decom but you will be working with an organization and you can manage contributors in a more efficient way you can manage your team members in a more efficient way and you will have additional tools like workflows and workflow templates and that's crowding Enterprise now let's talk about Visual Studio code and how you can use the croing extension for visual studio code to localize your web application or any application really because the extension works for basically all the types of files that are supported in crowding here we are in vial Studio code I have a folder named my app a very general name that is intentional because you can use this with any application and in inside my app folder I have the locals folder this is usually how you would structure a localization project somewhere in your project structure you would have a local folder where you would store the translations and the original strings of your project and that is what you would upload to crowding to translate in the translation management tool of your choice or the localization management tool inside local we have this folder Visual Studio code is just abbreviating this because I only have one folder inside that folder so it's like compacting it into the same line this is another folder named en n from English and this is where we will store the original strings in English inside that folder and I have a file called main. Json for this part of the of the course I'm going to assume that you are already familiar with Visual Studio code you already have it installed you already know how to create folders like this by right clicking here on the Explorer create new folder and you are familiar with the Json format if you're not familiar with this format a quick overview is that it's a lightweight format used to exchange data across the web it's very popular and it's also used for translation projects we will use it when we use the I8 Max framework when we actually translate a sample website which we will do in just a few minutes so here we're going to keep this example simple to show you how the extension works but of course you can apply everything you learn here in these next few minutes to Applications of any complexity I'm just going to show you the main functionality of the extension for our demo we're going to use the the main. Json file you can name this file whatever you want like messages or notifications and the content can be anything that it would be valid in Json format but the key thing about the Json format is that it's wrapped within curly brackets and within the curly brackets we have key value pairs the key is separated from the value with a colon and the pairs are separated from each other with a comma what you would usually do in an application is writing everything that appears in your application everything that the user can see here in Json files instead of your actual HTML files so it would be like avoiding hardcoded values you would keep everything in the Json files and you won't have one Json file per language so when the application loads or the user changes the language the correct translations will be applied and for that the keys that we have over here are essential these are the keys that we will be writing in our application to replace them with these strings in the corresponding language all the Json files that we're going to create in all the different languages will have the same keys so our application will know exactly what to look for in the corresponding language folder that's the basic principle of how we structure these localized applications we take everything out and instead we have it in the Json file and that is replaced automatically by our localization framework we will see that in just a moment in a practical example with a simple react application I'm just giving you a quick overview because that's how we're going to structure our project here for the the extension we can see the title welcome to Free code Cam and the mission is to help people learn to code for free we will be localizing these two strings and in theory they would be replaced automatically in the application right now we don't have any other files we're just focusing on the locals folder I will show you how you can upload these strings to your couting project and how you can download the translations directly within Visual Studio code with this extension to install the extension you just need to go here to the extensions option in the activity bar to the left and write crowding if you write crowding here and you click on crowding you will be able to click on this button to install it I'm installing it right now and you can also find more details here in the documentation of how to use it and how to set it up but I'm going to show you that step by step you could also go to the official GitHub repository for this extension crowding for vs code great so after we have it installed I can see now that it is installed I can go back to my Explorer and now I see this new Option this new icon here crowding let's see what we get we get three new panels in this tool we see upload we see download and we see progress yes we will be able to check the progress of the translations directly with within Visual Studio code so let's do that after you install the crowding extension you need to follow these steps because the crowding exential will add some commands that you can use from the command pallet first you need to sign in to crowding so we will open the command pallet with command shift p or control shift p on Windows notice here we have all of these new commands we have sign in select project focus on upload view Focus Fus on progress view focus on download View and create configuration so first of all we need to sign in I'm going to click on sign in and this says that the extension crowding wants to sign in using crowding so we're going to allow that do you want code to open the external website I'm going to open this and I want to continue the authorization request here I'm going to sign in again because the my sign in just expired so I'm going to sign in again I'm going to log in and then I see my authorization request for crowding dcom crowding for vs code requests additional permissions this application needs access to your projects it grants access to manage projects a user has access to so we're going to authorize the extension to do this for us and then we're asked if we want to open Visual Studio code. apppp then I click here on open it because I want to to open it and then we are going to accept allowing crowding extension to open this URI open and there we go we have the extension configured but we also need to create another configuration file and select the project that we are going to be synchronizing from our local files so first of all we need to create a project on crowding dcom I go to crowding decom I go to my main profile or dashboard and then I'm going to create a new project again I'm going to name this free code Cam vs code extension demo I'm going to name this it's going to be a very long name this but free code Cam vs code extension demo again it's going to be public because I'm on the free account so I can't create any more private projects The Source language will be English and the target language let's say that it's Spanish right now of course I can always add or modify the target languages but for now let's start with Spanish and I say create project project created successfully free goam vs code extension demo currently it's empty but now we can choose that project from vs code for our extension after we have that created on crowding oncom we go back to vs code and now we can run that command we open the command pallet again with command shift p we write crowding and then we select the project it's going to load our projects and here I have my three projects from my account I'm going to select this project free code Cam vs code extension demo crowding could not find a configuration file yes that's something that we are going to create right now and the project I can see this message it was selected successfully so now I can close These Warnings the configuration file is another thing that we have to generate first we sign in then we select the project and then we create our configuration file this will tell the crowding extension what files are our source files and where we want to store our translations so I'm going to open the command palet again yes there are a few commands and the third command that we are going to run is create configuration once the command runs the file will be automatically created crowding yml this is a configuration file we see a warning that the file source is empty in my app and that's true the source and translation Fields the keys are empty so we are going to change that in just a moment what is source and what is translation we will keep seeing that error or for the warning until we just remove this so I'm going to just add a letter here to avoid that warning great but we do need to write something meaningful there in source and translation Source will be the path to the files that we want to translate where are we storing our source strings our source language is English so where are we storing our source strings in English that would be main do Json here we have the keys and we have the corresponding strings in English so we have to write the path to this file how can we do that well we are in local then the en folder remember it's in English and then this is something very interesting that crowding supports we can use a wild card this asterisk match any file name that ends with do Json that's basically it we're not writing any specific name we're just matching any name that can be here within the E folder that's the path to our files and then for translation I'm going to do this we need to write the path to the location of our translated files but how can we customize this for every language let's say that we have multiple Target languages well crowding supports using placeholders for this so we can create a folder for Spanish with es and a folder for French with FR FR if we need to translate our files into multiple languages or for Italian that would be it or Japanese JP we can use the twetter codes with this placeholder two letters code like this the only important key aspect here the only key thing that you have to keep in mind is that you need to surround the placeholder with two percentage symbols that's what tells crowding that this is a placeholder and then we can assign the original file name with this placeholder as well so if the file name was main. Json this will also be named main. Json with this placeholder but it will be within its corresponding folder with the TW letters code if it's French it would be F FR and within F FR we would have the main. Json file with the French translations that's what's so powerful about this configuration file that you can do all of that with just one line using placeholders and this will also keep the Json extension we will see that in just a moment so now we have our configuration file we have our folder and now let's go to crowding to the tool the new tool that we just installed in the activity bar and voila here we have it we can see it in upload and download and we can also see the progress bar here like this so now we know that we signed in correctly and the configuration file was correct as well now before we do anything if we check crowding oncom we refresh the page we can see that we currently don't have any files to translate that's because we haven't actually uploaded any of our files files to do that we just need the configuration file that we just wrote and then we go here to upload and we have two options here we can refresh and we can upload all our source files this is very helpful when we are sure that we want to upload all the source files that we currently have in the path but if we don't want to do that and we want to select them individually we can just click on the Arrow next to them or we can upload the folders here we can also edit the configuration file if we click on the gear icon let's upload main. Json I'm going to click here to be more specific we see uploading file main. Json and after that if I check the the web version and I refresh this I should see yes I do see it it's here in the local folder English main. Json so I was able to to upload the file following the folder structure that I had in Visual Studio code I can then take that file and translate it to my target languages let's go from the sources tab where we are right now we're going to go to dashboard and we're going to translate the two strings into Spanish I click on Spanish then I click on this file double click on the file and then I see the two strings here that I can translate crowd is smart enough to know what parts of the Json file have to be translated it's not going to translate the keys it's going to translate the values so I'm going to translate this as BOS a free code Camp I'm going to save this and then I'm going to translate this string this would be the Spanish translation help people learn to code for free then I'm going to save this translation and you can see that the two strings are translated so now we finished translating the entire Json file if we go back to our dashboard into this Spanish section we see that the file is 100% translated so let's go back to our vs code project and now we can go to the download part we can also check the progress here in Spanish and we can see that if we refresh this sometimes you will need to refresh the progress tool to actually get the current progress you can see that previously it was Zero now it's 100 and only after I refreshed it it showed 100 so this has been 100% translated but 0% approved let's approve them just really quickly since I'm also a proof reader here I'm going to go to the string and I'm going to approve it and here I'm going to approve it too then I reach the end of the file they're all translated and approv and now if I go back to vs code and I refresh this I see that it's 100% translated and 100% approved the Spanish language so that's great and now I can download my source files in Spanish and this is the true test for the configuration file when I download these new files in Spanish they should be within their own es folder that they should it should keep the same Json file the same name but they should be translated and they should have the same keys and they should be within their own es folder so we're going to test that we can always change the configuration file if we need to but let's download them you can also resize these tools if you need to okay if we hover over the my app folder we see the option to download the project translations we see the option to download source files and we also see the option to edit the configuration that opens the this file the configuration file so we have a quick access to that file if we need it here if we click on Download Project translations let's see what happens downloading translations it might take a moment depending on your internet connection and the current state of the system but if you go next to the Explorer here it is here it is here it is here it is now we have two folders English and Es which is the twetter code for Spanish we have our folder now it's collapsed but if I expand it I see main. Json so we are keeping the same file name in the two folders and that's usually a convention that we use we keep the same file name but we keep them in different folders with their translations and then in Spanish if we open the file we see that they are keeping the same key title and Mission and we are only translating the string associated with that key these are the translations that we wrote and approved in crowding tocom in the online platform so you can see how this workflow can really save you time you just go there to crowding decom or your translators go there your team goes there your organization or the your community translates the files that you need and then you can synchronize them in Visual Studio code so it's very very helpful and it's basically automated because we are already defining our source files and our translation files and the location where we want our translations to be in this will use the standard two-letter codee for the language so if you have three or four languages you would have all of them here and you would have the main. Json file with the corresponding translations you can always repeat the process upload any new files download them and you can check the progress for every language how much it has been translated how much it has been approved awesome now you know how to work with the crowding extension for visual studio code it's really powerful again I encourage you to review this part of the course if you would like to continue working with it and install it if you haven't so far let's continue now we're going to start diving into a more realistic example of a react application it will be a simple application but we will be working with the IIT next localization framework and we will see how we can use this extension to translate the files and we will also use the GitHub integration so you can translate your repositories using crowding Integrations so let's continue congratulations on reaching this part of the course now you know the fundamentals of a localization process and you know the fundamentals of crowding for individuals and teams so now we're going to start the actual developer Focus part of the course we're going to translate a react app this very simple react app but you will learn the fundamentals of the i18 next framework for react called react IAT next we will use that frame work to create this simple app but we're going to be able to change the language like this we can go from English to Spanish and vice versa with this drop- down manual by just selecting the option we will be working with Json files and I'm going to show you how you can use the crowding extension for visual studio code to translate your Json files like we did before but now we are going to apply this to a react project so you will learn the fundamentals and of course you can apply these principles to Applications of any complexity and applications in different context like mobile development web development and other types of applications I kept this application simple on purpose intentionally because I want to focus on these fundamentals so let's begin if we go to visual studio code now we see the localized app folder this is where I'm going to create my react app with create react app you can also use V or any other tool that you can use to get the starter code for a simple react application to create that I'm going to use this terminal and I'm in my localized app folder and I'm going to run npx create react app and here instead of writing the name of the folder like my app like we have in the sample documentation I'm going to write a DOT that tells the command that I want to create the react app directly in the folder where I am currently located so I'm going to press enter and the process will start I'm going to assume here for this part of the course that you're already familiar with react we're going to make some changes to the main app component and then we're going to localize that specific component we are going to wait until all the packages are installed in case you would like to review the fundamentals of react we also have other courses on the channel I'm going to keep this app simple so the fundamentals of react should be enough if you know them this can take a while to reach the end so I'm going to speed things up a bit to start working and here we go we have our react up our starter react up with all the basic files and the folder structure if we check this with have we have all the files within the source folder we have the resources within the public folder we have our node modules the basic node modules we're going to install some to add support for the localization framework I8 next for react we also have a package.json file with all our dependencies and a readme file with the license for this um for this starter code the the project was bootstrap with create react app of course you can also use any other tool like V that's totally okay and the the principles that I'm going to show you here will still apply there so now I'm going to refresh my terminal and I'm going to start the application with mpm start and here I can see the the app that I'm getting by default with the starter code we're going to edit app.js and we're going to save that to get our new application we're going to build that step by step here we're also going to make some changes to the CSS file but we're going to do that really quickly because we want to focus on localization right so I'm going to hide my terminal for now hide it hide it for now great I'm in app.js what are the main changes that I'm going to make to this app to get the user interface that we are looking for first of all we need to change the logo we're going to use free code cams logo you can get that logo from free code Cam's official style guide I want to replace this react logo with the free C cam logo so I'm going to put it on the same path right now this logo is over here in the source folder so I'm going to put my free C cam logo here I'm going to drag and drop it I already had it in my folder in another folder in my file system so I'm going to use that I'm going to like basically swap the logo with this one I just need to change this path to FCC primary large instead of an SVG file it's a PNG G file logo over here and since I don't need this logo the react logo anymore I can just delet it it's an SVG file deleted you can keep it if you like but I'm not going to use it this is what the preview looks like it's just spinning over there so let's go to the CSS we're going to make it stop spinning by removing this last key frames from the CSS file and here in app logo we're going to assign it a height of 50 pixels and we're going to just remove all the animations for that logo like this so if we go back now we see the free cam logo in a more reasonable size you can of course customize this to your liking after that we want to edit the text so we're going to replace the link and the text we're going to replace all of this with an H1 text this will be welcome and then we are going to add four paragraph tags over here the text will be in English by default for now until we actually Implement localization then we are going to replace that with the corresponding keys but as a placeholder we're going to use the text build projects earn certifications learn to code for free build projects earn certifications that's the text that we actually have on the landing page at free code camp and then we are going to add a fourth paragraph tag this is just for demonstration purposes and it's going to say that the language is currently set to English this is going to change dynamically we're going to show this with a strong tag the strong tag is usually used for text that is more important and I think that is important because it highlights the language of the application the current language you can of course customize this I'm going to choose strong and then we will be replacing this by a variable using a hook a state hook the state will be the current language we're going to assign this ID to the paragraph language text so we can change its specific style and after that within the header tag we're still within the header we're going to add a select element this select element is going to be named language in a future iteration of this project you may want to separate this into multiple components I'm just keeping it simple so we can do all the localization here in the app component within the select element we have the option this option will have a specific value en n and this value will be essential this value is going to tell our entire application what language we have selected English then we have another option value Spanish and we're going to write all the options in English right now we could write espanol here which is Spanish in Spanish but I'm going to keep things simpler so they're all in English so everyone can understand them and then that's our select element so let's apply some Styles and then we're going to add the functionality but before we do that let me add a suspense element the suspense element is very helpful in react because it gives you a way to show something while these components or elements are being loaded in the application so it's just like a backup or a fallback in case this takes a moment to load and with translations that can happen if you are for example fetching them from an external API which crowding actually has you can fetch your translations from an API and that can take some time so if we fix the format here with command shift F or control shift f we get the code nicely formatted and you can see that suspense was already imported automatically from the react module let me just move this to the top great so after we have that let's add style because if we see the application right now it's very basic it doesn't have like any custom style but it's still there it's taking some interesting shapes let's go to app.css and here to save us some time I'm going to copy and paste so we can move faster but you can of course pause the video at any time if you would like to check these Styles and reproduce them yourself I'm also going to include them in the repository but I'm copy pasting them one by one to make sure that you can see them clearly and you can always pause to know what I'm doing or what I'm changing here here I'm going to change the background of the application to match free code cams style guide this is one of free code Cam's main colors we're going to keep all the other styles here we may not need them we may for now we're going to keep them maybe in the future we're going to remove them for now we're going to keep them and finally app link and we have this color great so that's our CSS file let me go back to control and now we can see the same style that we had in our application preview that's ready and we see the two options English and Spanish but right now this is not working because we haven't actually implemented anything in JavaScript yet in our jsx file so we're going to start doing that in just a moment let's dive in when we change this to Spanish these strings should be replaced by their corresponding Spanish translations and we will be translating them in crowding with the extension we will do that in the next part of the course so let's continue so let's start implementing the actual localization functionality because so far we've been just building this basic react up let's start with IAT next first of all how can you get IAT next because right now it's not installed it's not part of our dependencies we need to install it and add it to our package.json file we can do that with npm we just need to start a new terminal here that could be SE CSH and after that we will need to run npm install let's close the Explorer so you can see it here and mpm install I8 next that will install the I8 next framework as a dependency we will actually install three different variations of this framework I8 next we will also install react I8 next and then we will install I8 next HTTP back end this is based on nodejs and it's a way for the framework to send us the the localized versions of the files the translations as a Json in Json format through the server the local server that we will be running when the react application runs in the browser if we don't install this if we don't use this then we will not be able to preview those translations you can always choose a different back end and IAT next also has a documentation of the different backends it supports like you can call an API you can get the translations from an API you can also use other backend calls so you can use different backend approaches for now we're going to work with local Json files to keep things simple so again we press enter we're going to to install it and there we have it we can kill that terminal now but we have to keep this terminal alive if we want to keep the react application running we close the terminal in the X and again if we go to the Explorer to the package.json file now we see that we have I8 next I8 next HTTP backend as dependencies and we also see react I8 next so we will be working with the three of them right now after we have them as dependencies we will need to import them we go to app.js and we're going to import specifically i8n from i18 next we're also going to import HTTP backend from I8 next HTTP backend we see that it's Auto completing so that's really helpful and then we're going to import two things actually from react I8 next you can see that we are using these three dependencies we're importing iatn we're importing HTTP back end and we are importing two elements here that we will be using I promise you we are going to add them that will be initial react I8 next and use translation this will be like a hook to use the translation where we need to we're going to use this to replace the hardcoded strings directly within the jsx elements if you want you can divide these import statements into a different like block because they're all related to localization that really depends on your personal style and the guidelines that you're following for your team and to finish off our import statements we're also going to use use state so we're going to import it here this is a normal Hook from react great so let's we can of course readjust these import statements as we need to if we want to group them for now we're going to keep them all together and then before the app component we have to set up the localization how are we going to do that we're going to use the iatn object that we have here that we imported from IAT next and we're going to call a few methods on this we're going to make it use the HTTP back end we're also going to use init react I8 next and we're going to initialize this to a few options within in it we have the curly brackets this is going to be an object with different options first we have a fallback language this is the fallback language in case the the user of the application selects a language that is not available or we don't have the translations if anything happens we will fall back into English and we also configure the back end where are we going to load these translation files from where are we going to take them well they're going to be available at a specific path remember the path that we saw in the previous section when we started talking about the extension in a folder named locals and then a folder for that particular language like this would be e n for English or ES s for Spanish JP for Japanese and for that for replacing that particular language here as a placeholder we use these double curly brackets that's a standard in IAT next the twet code and then we are going to store them in a file named main. Json we need to set that up in our file structure but for now we are configuring it in our Javascript file so now we have our back end set up we have everything set up we're using HTTP backend we're using react IAT next we have our fallback language and we are setting up our back end where are we going to look for those files that we want to serve with the local server we have everything ready to start actually working on the app and replacing those strings like this first we're going to set up our event our goal is that when the user clicks on one of these options from the drop- down menu when there is a change we want the entire translation to be replaced right the all the strings so we need to listen to that change we need to have an event listener we're going to add that to the select element on change that's the event and how are we going to handle that with the onchange function we Define the on change function over here within the app component const on change and here we have it we are going to use an arrow function for this this would be the event the parameter we can also call this e it's a a normal standard I'm going to call this event and just to test this I'm going to print this value the event has a Target that is the the the drop- down menu the element and the target has a value that value will be the value of the option that we are currently selecting so if we select Spanish the value will be es the value that we are setting over here that's the value that we are going to get from that event from the target if we select English we're going to get En n and that will be fundamental here to handle the change so let's test this and see if it works let's see if it works here we are in Chrome I just have it full screen so that's why this is still the browser if we right click and we click on inspect we can see the console and let's change this to English now we see e n if we change this to Spanish we see es s so it is working we are reacting to that event but how are we going to actually handle the event because we don't just want to print this value we want to do something with it when we change the language we want two things to happen we want the localization framework to know that the language was changed and we also want to update the language over here remember that this is still hardcoded it's still a fixed part of the string we want this to be dynamic and be replaced by the language so I'm going to take a relatively simple approach here you could also increase that the complexity and multiple languages but since we only support two languages right now I'm going to use a tary operator to change the language in the IAT n Frameworks to know that we have to load the new translations we call the change language method on iatn this is the same object that we imported here from I8 next then we call change language and then we pass as the argument the value that would be or ES or the the the value that we are setting for that option that is the twetter code for that language that will handle that from the framework side but we also need to change this value over here English we want to set it to English or Spanish and we're going to use a state hook over here to do that so we're handling both the framework and the text update simultaneously if you're familiar with hooks you know the Stak hook we have let's say language this would be our state set language and with the used State hook we're going to set English by default we can set the language over here so language and then if we have that state we can replace it over here instead of just writing English we can replace this with Language by wrapping it with curly braces next the next thing that we need to do is that on when there is a change we just update the language and we're going to do that in a very simplistic way for this uh purp for this tutorial we're going to just call set language and we're going to take the previous language that we had in the previous state and then we're going to check if it's English if the language was English then we are going to change that to Spanish if not not we're going to just keep English so that's our approach of course if you're supporting more than two languages you may need to to use a different approach but for Simplicity purposes since we're actually focusing on the framework I'm going to update this in a simple way so how are we handling this right now well you can see this working if we change this to Spanish this changed to Spanish if we Chang this to English this changed to English so we are handling that change appropriately but we don't see that these strings are changing in any way for that we are going to replace the text that we have over here because if we just write the text directly in the component the text will never be modified it won't be dynamic we need to change that to something that can change when the framework detects that the language has been updated to do that we just need to add a hook over here we need to have access to a hook named T usually the name is T and we're going to get that from used translation remember that we imported used translation from this react IAT next we're going to use this use translation to get the T hook and then we're going to use T this will be essential this one letter identifier here is going to make all the magic come true because we're going to replace these strings with something that we're going to get from the te and for that we need to set the Json file up first we want to remove these hardcoded strings from our Javascript file so for that we need to start creating our Json file and get all the English strings or the source strings over there usually you will find the locals folder like we have over here in the public folder so we create a new folder we name it local and then within local we create a new folder named I for the English strings within the English strings we create a new file make sure that you're clicking here on en instead of locals because the file has to be here in EN and we're going to name this main. Json you could choose a different name but I'm going to name this main so we have all the main strings over here make sure that it's within n here and then within main. Json we're going to Define our Json file with the key value pairs let's say that we want the key to be welcome here welcome and then we want the first line to be the key the key doesn't necessarily have to be exactly the same as a string okay it's just like a way to identify that particular string so this could be name and this would be the name or this could be address and this could be the address it it doesn't really have to be exactly the same text itself it's a way to identify that string across the different languages remember that the keys will be shared across the Json files in all the languages so they will stay in the language they were written in they will say in English this would be the first line of the text that we want to show this would be the second line we need to separate them with a comma and this would be the third line these are the keys they could be more specific but I'm just writing them like this first line Second Line third line for Simplicity purposes you can of course make them more descriptive so now that we have them in the Json file we can remove these hardcoded these fixed strings from our app.js file instead of just writing welcome here we can make this Dynamic by wrapping it with curly brackets and then calling T within parentheses we pass welcome as the argument this is the key of the string that we want to replace over here this is this value welcome welcome it's the key and that will tell the app our app that we want to use the string that corresponds to this key in whatever language we currently have selected that's what we are configuring here we're making this Dynamic but since the key is shared across all the different Json files in every language this is a fixed value that we can use in our app and we will still be dynamic then we're going to do exactly the same thing for the next component but now instead of welcome what do we want to replace here this string the key for that string is first line so we are replacing it over here then we do exactly the same but now we have second line and then third line this could be more descriptive if you're working on a more complex application I'm just keeping things simple here because we only have three lines like this and how will the framework know when the language was changed and what language it has to select for this particular Key Well it knows because here we are calling change language and this will be the two-letter code for that language so it knows that it has to look in that particular folder and get the corresponding Json file that's how we set things up over here when we are defining the local path it will look within the language folder for the file named main. Json if we check the application we should see the strings replaced voila now we don't have any hardcoded strings let's see this in our application let me close the Explorer right now we don't have any strings over here this final paragraph We are going to keep it this way because it's updating automatically it's in English so it helps us to keep track of the current language if we don't actually know the text so I don't know it's just I think a a small little detail that I would like to include or keep this in the demo so if you want to translate everything you can also take the challenge of localizing this as well but these four lines that we are focused on are being replaced automatically but if we change this to Spanish we see that nothing happens right that's because we don't actually have a Json file for the Spanish local we only have the English folder so how can we actually create the Spanish folder and translate that in crowding let me show you that let me show you this if we go to the crowding extension we see welcome back Stephania demo that's because I'm already signed into my account you will see this message if you're already signed in if you're not signed in remember that you can go to the command palet search for crowding and you can click a sign in you will have a sign in Command right now I have a sign out command and it's helpful to know this too that you can sign out anytime you like and then of course you can create a configuration file as well so for now we're going to create a configuration file create configuration the file is added over here to our react app structure at the root of the project and here we need to configure source and translation how are we going to configure that where are our source files the files that we want to translate we already extracted all the strings into our Json file and that's where our source string live that's the source language so we have to write the path to our source that would be locals then en n and then Main dojon and then the translations would be a bit different they would be similar to the path that we wrote previously locals then we would use the placeholder of two letter two letters code now you can see why the placeholder is very helpful especially for react this will create the folders dynamically like we had before when we installed the extension remember and then we're going to keep the original file name with this placeholder like this so we have our source and we have our translation we should double check these paths and they look okay if we have to make any adjustments we can make them afterwards and then since we need a project on crowding let's go to crowding let's go to crowding I'm going to log in again because I spent too much time outside of the platform so I was not locked in great so I'm back here and I want to create a new project this will be of course a public project we're going to name this free cam react public project The Source language is English and the target language right now will be Spanish we can add them later on create project and I don't have any sources but remember that we can upload them we do have the target language in Spanish but now I can select my project in VSS code I have my configuration file ready and I can open the command palet with command shift p then go to crowding select project it's going to load all my projects I'm going to select Freo can react like this and then uh voila here I have the files that I can upload the files that I can download and my progress right now it's 0% because I haven't uploaded anything but I can upload my files over here I'm going to change this to the asterisk asterisk Json if we only write locals here it's not going to work because it's within the public folder so I'm going to write public over here and now you can see that it is being displayed so I see public then I see locals and I see English and then I find my main doj Json file that's the Json file with the strings that I want to translate so let's upload the file upload source file remember that I'm already signed into my account uploading file main. Json once the process is completed if I refresh the browser I can see this in the sources tab I do have a public folder with the English folder and main. Json I can change this settings of that file within crowding and it can start translating Spanish then if I translate let's say welcome benos I'm going to save this translation this will bear then this will be conr Pro and then this will be obtain certific this is the the text that we have on the main free Cod cam landing page then I'm going to approve these strings just for demonstration purposes so we can download them to vs code like this and I reach the end of the file so I have it 100% translated and approve you can see it here if we go back to visual studio code now we can download the translations by clicking on this Arrow here we will also need to add public before the Local's folder to actually reach that path we need to write like the full path to that folder public locals and that's when we can actually download our files we can click here Download Project translations it's going to download the translations and after that if we refresh this you should have something like this in locals you see English and you see Spanish and inside Spanish you can see this Main doj on file we have the same keys but the strings are translated and we translated them on crowding decom and we did all of that through the crowding extension and of course we had to go to the online editor but it's super easy to synchronize your localized files with your local project the local folder can be inside the public folder or it can be inside the source folder it really depends on your personal preference the public folder is for files it should be available anywhere like the the Fab icon or any Json files some developers prefer to keep the local folder inside the source folder so it's really up to you but you just need to update the paths to reflect that change great so now we have the Spanish translations and we have the keys now if we go to our application and we change the language to Spanish here we can see that translated strings they are replaced automatically when we change the language with our method in the app component we see that the language is currently set to Spanish and then if we change that to English we see all the strings in English again those are the fundamentals of how you can use the IAT next framework for react and crowding to set up your translation workflow as a developer this is very helpful and you can also automate this further with other Integrations that can help you to automate the process even further but these are the fundamentals so great work you're taking big steps into this world of localization if you want to add any other languages Beyond these two you would need to change the logic of the app.js component of course because here we're only handling two languages to update the text and if you want to have more languages you would have to add more options here in the drop- down menu each one with it some particular value it's twet code the standard code and then you will also need to have a main. Json file for each language you will need to translate that in crowding add them as Target languages translate them and then download the translations awesome now that you know how to translate your application or website in vs code with a crowding extension for vs code we're going to start diving into the GitHub extension because this is a way to keep crowding and your GitHub repository synchronized if you're planning to host your project on GitHub it's like a way to automate the process it will make it so much easier let's go to crowding dcom to my profile and I'm going to create a project of course this will be a public project because I am in my free account so free Cod cam GitHub this will be the name of my project free Cod cam GitHub we're going to test the GitHub integration to see how it works this is a new option that crowding added from my previous the previous parts of the course they're constantly adding new features and things that you will see in in the platform compared to when I recorded them of course so don't be surprised if you see anything marked as new you can also enable string based project but right now we're not going to work with with that the source language will be English and the target language let's select Spanish for now let's also select Japanese and Italian just as an example just to select a few of them let's create the project project created successfully free code cam get home and right now we don't have any projects to translate that's intentional because we're going to import them through an integration we're going to to add an integration remember that with the free plan you can only have one integration at a time and the integration that we're looking for is the ghub integration we click on it and we install it this application will have access to your projects and it will be displayed in the project menu Integrations GitHub the users that will be able to use the app will be only me you can also customize this to fit your needs select the projects where users will be able to use the app projects you own or selected projects I'm going to choose selected projects and only on free code cam GitHub I'm going to restrict the app to only work on free code cam GitHub so I'm going to install it and I see that it was successfully installed I can also uninstall it but for now let's close this and if I refresh the page now I see the GitHub integration here and I need to set up the integration to set it up I need to click here on on setup integration there are two different modes for this source and translation files mode and Target file bundles mode this is actually new and we can find more information about this it says that it exports sets of strings in one of the selected formats if we go to this article in the crowding knowledge base GitHub integration file based we will see the specific description for these two file modes for the source and translation files mode this will synchronize source and translation files between your GitHub repository and the crowding project this is what you'll use most of the time and they also have another Mode called Target file bundles mode this will generate and push translation files to your GitHub repository from the crowding project in the selected format in this mode the integration pushes translation files and doesn't sync sources from your Repository in cases when you perform a source text review in your crowding project and you want to get updated Source text to your repository you can add a source language as a target language which will be pushed to your repo along with translations this is a quick overview of what the crowding team explains about these modes but I highly recommend going here to their knowledge base to the GitHub integration article to learn more about them for now we're going to stay with the traditional mode here here I have my GitHub account I am going to authorize crowding you will need to do exactly the same you should read the permissions very carefully you will be granting access to your public and private repositories including your code issues pool requests weeky settings web Hooks and services deploy keys and collaboration invites the repos scope also grants access to manage organization attributes and organization owned resources including projects invitations team memberships and web hooks so I am going to authorize crowding here and use my authentication code now I'm being redirected and I can see the GitHub integration I will select my account over here then the repository the repository that I will be working with is localization GitHub integration after I select the repository I have different options that I can customize select branches for translation I only have a main branch right now so I'm going to select that and this service Branch name just means the name of the branch that will be created when crowding pushes the translation crowding will create a pool request with the updated translations with a new Branch so you can check the translations before you actually merge them this is ready but you can also change the branch configuration in the project we see that this is already because we already had a crowding do yamu file in the repository this is basically the the react app that we worked with in the previous example with the visual studio code extension I removed the Spanish translations but I kept the crowding yamu file so that was already configured if I click on this the pen I can see the source and the translation paths they're exactly the same as we had before we have public locals English and then the wild card. Json we can also change this to main. Json if we don't have this yamu file already created in the project we will be able to create it by customizing this path and we can preview the source files here we have we see that it's in public local English and then main. Json and then for the translated files where we want to store our translations we're going to store them in public locals then the two letters code and then the original file name here we have public locals and this would give us a preview of how we're going to store the translated files in our project structure this would be Spanish main. Json Italian main. Json and Japanese main. Json so this is very helpful to work with different placeholders if you click on this eye over here you can see a list of placeholders that you can use to set a translated file path and a name like this we have the original file name the original path the file extension file name language two letters code three letters code the local local with uncore Android code OSX code and OSX low count I encourage you to dive deeper into this placeholders because they are helpful to customize where you're going to store the translated files you can also select multilingual files so then we are going to save this and we can add a file filter this is a more advanced function we see that the configuration will be saved as crowding doyo file in the main branch so we save this and then we find more settings this setting will help you to deal with branches efficiently to set how you're going to handle duplicate strings across different branches because you may have the same keys and the same localization files the same source files in different branches how are you going to handle those duplicate strings you have many different options you can show them and translate each instance separately you can hike them you can share the same translation across all the duplicates it's really up to you what you do with these options but for now I'm going to keep the default so translators will translate each instance separately then I see these options over here I see onetime translation import after the branch is connected I can choose to always import new translations from the repository these two settings over here are related to how we are going to import our source files by default we see that we're going to have a onetime translation import after the branch is connected when we connect it right now we click on Save we're going to import our source files we can also push changes any changes made to the source files on crowding back to your repository if you make any changes to the original Source strings you can also push those changes back to your repository automatically but by default this is disabled because you will be changing the content of your repository and that's not always what we need and this is very very helpful for automating the process of synchronizing crowding with your GitHub repository this is the sync schedule it will set the frequency for pushing sources and translations to the repository 1 Hour 3 hours 6 hours 12 hours or 24 hours you can set your synchronization schedule the source files changes made on the repo will be synced with crowding continuously to reduce the number of the the pipelines configure the commit message parameter in the configuration file this is a bit more advanced beyond the scope of the course but you may dive deeper into this article if you click here on learn more and you can choose which branches you want to synchronize automatically and the default configuration file configuration file name for automatically synchronized branches if it's not defined then the crowding doyo configuration file is expected in the branch we do have that configuration file in our main branch so for now we're not going to customize this we're going to set our synchronization schedule to 1 hour which is is the default so we're going to click on Save over here and what this will do is it will start to synchronize the source files to crowding and it will show us the status it has been synchronized with our main branch we can pause the synchronization process we can edit this or delete the integration we can sync our repository right now manually by clicking on this button and we can sync our translations back to crowding if we already have some pre-existing translations if we click here on the data for that particular Branch we see that it's when it was last synchronize the status and we can synchronize that particular Branch synchronize translations to crowding or we can change the branch configuration we can also see any issues that may arise when crowding tries to synchronize the translations now let's see what happened with our project because so far we're just configuring the integration but we can see that it was successful so if we go to our dashboard and we check our Target languages now we do see the main. Json file over here you can see this in the sources tab two if we go to main because we're in the main branch and we go to local English we see main. Json that is awesome right and what happens if we go to a specific language like Spanish and let's say that we are going to translate a few strings we have four strings over here welcome let's translate this and save it let's translate a few strings and then we're going to synchronize the translations back to the GitHub repository bidos yes I'm going to approve this learn to code for free build projects earn certifications I'm going to approve all of these translations and then I'm going to synchronize these translations with my GitHub repository to see what happens here I am in my GitHub repository and I can see that in my GitHub repository crowding already created this Branch the internationalization main branch like this this branch is three commits ahead of Maine and I can see that some new commits were created if I go to my commits over here I can see that I have a new translations main. Json for Spanish for Italian and for Japanese these files were created automatically by crowding over here but they will be replaced by their corresponding translations once I start to translate in the platform so let's do that I have that file already translated into Spanish and approved so if I go here to my Integrations and I really don't want to wait that hour that I set up to synchronize the new translations with my repository I can click on sync now I'm going to sync it now and I will see that the status will be sinking sinking and it's still sinking it might take a while and if I go to my GitHub repository I see a new pool request new crowding updates new crowding updates new translations for main. Json in Spanish Italian Japanese and here I have Spanish if I go here to my Branch I can see that now it's four commits ahead of Maine I had a new commit when I synchronized that brand over here and if I click on it over here at the bottom I can see that now these strings were replaced previously they were in English by default and now they are in Spanish with the translations I submitted and approved now I have them in my Branch over here the branch is four commits ahead of main so I can check my translations very carefully before I decide to merge them with the main branch then I when I check them I can compare the this Branch with my main branch and I can see that they are able to merge so they can be automatically merged in GitHub if I want to I can just merge the branches in the pool request I click on view pull request over here and then I can merge the pool request I can also change the the description over here of the pool request and everything was done automatically if I merge the pool request I will be merging the translations into my main branch and I will be able to keep those files in the local folder you can see that these files were added and this is located exactly where I wanted to be public locals Spanish main. Json now you know how to use the GitHub integration remember that it will send you a pull request it will send a pool request to your repository that you can merge to your main branch and it will send it to the localization main branch or the the name that you assign to that particular Branch it's very helpful because that that way you can check the translations before you merge them in the live version of your project this is basically how the GitHub integration works if you want to check your branch configuration you can click on the ellipses Branch configuration load configuration from crowding yaml continue and then you will B basically see what we configured when we set up the integration you can change the source and the translation path like this if you click on it you will be able to change the source path and the translated files path with the placeholders that you can see over here they're all very helpful to create the path that you need for your application or for your project remember you can preview the source files and the translated files and how they will look and where they will be in your project structure if you you want to pause sync you can click here on pause and you can resume whenever you need to like this you can also edit the settings for the GitHub integration like this to change the sync schedule let's say that I want to change this to 3 hours I can do that and save it and I can also delete the integration so I don't use it anymore if you want to delete the integration then you can click here delete integration delete this integration well first I would suggest pausing the sync just in case and then deleting the integration remember that you can only have one integration per project if you're on the free plan so I'm going to delete it so you can see how this works and then well you can start from scratch again to set up the integration with the mode that you choose but this is basically how the GitHub integration Works in crowding it's way to automate the process basically what we were doing with the VSS code extension manually now we can do that automatically through GitHub I hope you found this helpful so let's continue to the next part of the course congratulations on reaching this part of the course now you know how to translate your website or application in vs code with the GitHub integration and now we will see a third option which is actually a bit simpler and it may be a good alternative for static content like a blog or a landing page a personal portfolio that type of website that is mostly static where all the content is already there when you load the page and that option is called ajs proxy a JavaScript proxy we will be translating the strings from this sample website you can see that we have some strings in English that we translate let's say into Spanish or into other languages we also have some Lauren Ipson placeholder text over here but we won't to be Translating that in this example we will translate the strings that we can translate here that are not placeholders so let me show you how this works it's very easy to set up with a crowding integration for that we need to create a crowding project we're going to name this free code Camp JS proxy you can see the project address it's a public project The Source language will be English and the target languages will be Spanish Chinese simplified and Hindi just to select some languages of course you can always change this list or modify it afterwards but it's just to get started with a project and what we're actually going to do is translate them into Spanish great so we have our project free cam JS proxy The Next Step would be to add the JS proxy integration we go here to the Integrations Tab and remember that with the free plan you can use one integration you can add one integration per project so you click here on ADD integration and then you browse the list JS proxy translator this is a free extension that allows you to translate content with proxy translation technology and what is a proxy a proxy is like a server that acts as an intermediary in resource requests from the client to another server so we're basically adding like an intermediary in the process of actually retrieving that website and seeing it this will be translating our website very easily it will basically crawl the website extract all the strings that can be translated we will be able to translate them in crowding and then synchronize that so people can see it live on our website you can see it here it will crawl your website and extract all the translatable text in your project you will find a new file with text for translations once the translations are ready you can add them to your a website using over the air delivery we will see how this works in just a moment you can also find more information here in the apps and integration section we're going to install this and we can see that it will have access to our projects who should be able to use the app only me in this case only me again and where will we be able to to use the app only in the selected projects the free cam JS proxy project like this we're going to install it and here we can see that it is installed successfully that's great so after we have that integration installed if we refresh the page now we will see the JS proxy translator integration let's go into the details where we can set up the integration remember this is mostly used for static content content that will not change while the use is actually reading or seeing that information it's not for dynamic applications it's more for like blogs or landing pages where the content is already there it might take a few seconds but it will load and here we can see how to set it up synchronize all source files with your project and send new translations from the project to your website immediately so let's take a look at these settings how we can set this up remember our goal is to get these strings which are hosted here on my GitHub subdomain my personal subdomain in this path localization JS proxy this is a project that I created in a repository on my personal account so let's see the first thing we need to do is to specify the site URL this app will crawl your website and extract all translatable text in your project you will find a new file with text for translation so we have to go there where we are hosting our website copy the URL over here copy it copy it and then we paste it over here like this then in application mode we have two different modes server side which is default the application will scan the content on the visible pages of your website or client s your website administrator needs to add a JavaScript code snippet to each page this mode is useful for internal pages with authorization then if we check the site settings we can also configure the different site settings like separate files for each page if you want to have separate files for each page you can enable this option otherwise all the text will be imported into one file that's interesting that's something to keep in mind it's it might be a very important setting we can also have a page limit when you're testing the technology because website crawling takes time you can set the limit of how many pages you actually want to translate the default is 10,000 you can also specify the IDS of the HTML tags that you would like to be skipped during the sources import it's very important in case you don't want to actually import some of the elements the text from specific elements on your website use commas to separate the IDS you can also ignore the text or Elements by CSS classes that can be helpful too and you can specify which paths you would like to craw if this is not specified then all pages will be imported these are some examples of paths and how you can include them like about page article comments if you have multiple pages right now this is a simple onepage portfolio website okay we just have a basic information contact information like recent work some links articles testimonials and some contact information over here here we have internal links they are not links to other pages but if you do have multiple Pages you can configure this directly in crowding with the paths and you can also exclude paths finally we can see language detect type this setting is basically how the language will be detected it can be a query parameter this is the default it can be a subdomain like en here some websites use a subdomain for the localization for the internationalization process this would be the English version then you would have es for Spanish and then you would have your website.com or your main website domain or you can have a subdirectory like for example slem like this in this case we're going to keep the default for now maybe we need to change this in the future but we're going to keep the default and here we can see that after we add the JavaScript snippet which is a snippet that we will need to add to our code we need to make sure that we add this class in the body tag to avoid swapping translation swapping on page load how do we want to sync the source manually or daily this is very important for automating the process if we do it daily we can Auto Import once a day if we do that manually we can import it now and we also find options for publishing the translations the latest translations will be available for overthe a delivery for your website you can sync the translations manually or daily once a day and this is another tool crowning in context which allows you to translate directly over the website that you're translating but that is beyond the scope of this part of the course we will talk about it in the next part but if you need to publish your translations just click here on publish here you can import the strings and here you can publish them again you can do that manually or automatically once a day and finally here we see the language switcher this will be a JavaScript snippet that we can add to our website like we do with Google analytics this will let your visitors see the language switcher which is like a very small box at the bottom right of the website that users can use to change the language remember you must add the scanner snippet for each desired page so this snippet that we will see right here after we import the translations should be in every page that we want to translate let's import our strings now yes we have the right side URL so I'm going to import them import now we're starting the crawler let's see what we get this may take a moment might take a while because the crawling process is timec consuming so it will scan all the pages of your website you can see that now this says Distributing and we can see that the publish process has already started let's see what has changed in the project we may need to wait for a few seconds or minutes until the publish process is completed but while that is running we can go to our sources Tab and check if we have anything new there we you can see that it is loading so the process still running if we go back to the Integrations tab now after the process has been completed we will see this JS proxy generated and imported a source file a SL stepan cn. github.io dojon with your website text into the project it was last imported a few moments ago here you can also read more about translation strategies but if we we go to the bottom here we can already see that we have the script that we have to add to each page that we want to translate this is a language switcher and we will see it in action in just a moment but we can copy it here to our clipboard now if we go to sources we will see a new Json file and if we go to dashboard we just need to go to our target language Spanish click on it and then we will see all the strings that the web crawler extracted from our website and notice how easy it is to start translating let's translate a few strings like this about me projects testimonials contact we're going to translate the first five strings of the website and I'm going to show you how you can have a partial translation and translate it step by step and then synchronize the translations back to your website so we're going to approve these strings because you should approve them before you actually send them to the to the website to the live version of the website you can also check the quality assurance issues if you're sure that the word is actually written correctly you can just approve it like this and that's it we have the first five strings translated if we go back to the dashboard we can see some progress in the translation for Spanish so if we go back to the Integrations we go to the JS proxy translator for if we go back to our project we won't see any changes what crowning just did was calling the website and it extracted all the text from the website but how can we actually switch the language we need to add the language switcher we need to do that in my case I'm storing this in a GitHub repository so I will add this language switcher to my HTML file this is a basic website built with HTML CSS and JavaScript so I will add this to my HTML file and push a commit to my GitHub repository I will copy the script then I will go to visual studio code like this to the actual project and over here in head here we could add it at the bottom let's add a comment that this is from crow in we can format this nicely in the head dock we're going to add a script and we're going to add this style and over here we also see in side settings remember that we saw that for hiding translation swapping on page load after adding the JavaScript snippet make sure to add the JS proxy blur class in the body tag so we're going to add this class to our body tag this is something that is a bit like hidden here when you expand the site settings but it might be important if they are mentioning this so we're we're going to do this to avoid any potential issues JS proxy blur great so now if we check Source control yes we have the new script we have the new class and that's what we're going to commit to our repository so let me Commit This with the terminal I'm going to add a new commit to my repository and I'm going to describe it as adding a JS proxy adding the JS proxy script then I'm going to close this and I'm going to push it to my main branch in GitHub you might have to check if there is sensitive data that you may not want to publish here in the HTML file something you might like to keep to yourself okay so after we have that in the HTML file of the repository the site may take a few minutes to build again here we can see the the status the pages build and deployment status is in progress so we just need to wait until this is completed we see that it is pending and if we refresh it now we do see this little language switcher look at this it's really really nice we see that it's powered by crowding and it has our Target languages Spanish Chinese simplified Hindi and our source language English which is the current language let's see what happens if I switch this to Spanish right now nothing is happening why because we need to publish our translations we chose to publish them manually right so we have to click here on publish now publish now it might take a few seconds or a few minutes to update and you may need to refresh the website a few times while you're waiting but eventually you will'll see the strings replaced over here amazing right we have this in Spanish this is a string we translated and we have the other four strings here about me projects testimonials and contact great the language switcher worked here we are in Spanish and if I switch to English they are replaced automatically like this Spanish and English it's amazing right we also see this string being replaced English and Spanish you can continue the same process until you translate your entire website with all the different pages it currently has and you can see that the language switcher is adding this to the request it's adding the language that we are requesting as an identifier for that JavaScript the JS proxy the JS proxy is acting as an intermediary between the server and the client the original server of this website and the client if we try to continue translating let's say that we are going to translate additional strings like let's translate a couple of them we see students so let's translate it and see how we can again publish our new translations and we will see them in the website with the JS proxy right now we're doing all of this manually because we haven't set up the automated synchronization to daily but we're going to continue doing manually for now for demonstration purposes but you can automate this and do this daily after we publish them we will see them since I'm activating that blur you may see it blurry while you're refreshing while the translations are being loaded and here you can see this this is a string that we translated student in Spanish now if we switch back to English you will see the original strings in English so it's as easy as that I would suggest practicing this with other languages or with different projects but it's actually quite simple for translating static content remember this is not for dynamic content that will change over time all the content should be available before you actually start to crawl the website so you can get the full list of strings and translate them appropriately with the JX proxy integration you also have some additional options here that you may like to work with or customize like reviews strings to review you can import all of them you can clear the process cache import it and delet it and right now we don't have anything to display here but we may have some strings that need review we also see variables you can create patterns to replace similar strings with a single string containing placeholders for example replace strings like hello John hello chane with a single string like hello name you can set the pattern here with ADD pattern like this then you can use a title for a placeholder that provides translators with a clear understanding of how the rest of the string should be translated the placeholder would be this like username and it should be within double curly brackets that is an advanced feature a more advanced feature that you may like to dive into but I'm just showing you this in case you would like to use it in your project we can also see logs displayed um over a period of two months and here you can find help for this integration this is also very helpful and actually there is something that I would like to highlight here we know how it works right now you can read more about this to understand the details and the different modes but over here we find something quite interesting we can see the language switcher customization yes you can customize the language switcher to change the position submenu position and the a class if you would like to add a specific custom class to the language switcher you can set that with these parameters over here you can see them here in the script that you will need to add to every page that you would like to translate here we can see position top right if you want to customize that for a sticky position then for inline position you can also use inline left or right or any of these values for sticky position the submenu position you also have these four options and then the class would be some value for your custom class any class any custom class that you would like to assign to that language switcher and here you have more information in case you would like to add a call back to the language switcher which will be invoked when changing the language on a website this is helpful to detect when the user is changing the language so you can react to that so you can handle that appropriately the Callback can pass two arguments language code two letters language code for example here we have the script again but here at the bottom we also see the Callback in the Callback we are defining a JavaScript functions we have the language code as the first parameter and the two letters language code as the second parameter and over here we're just printing that the language changed and the message is descriptive because it's using the values of the parameters but you can customize this to fit your needs in case you need to do something in your code when the user changes the language so you can customize all of this I encourage you to read this help article when you install the JS proxy integration awesome work now you know how to use this integration for translating static content great now let's talk about crowding in context this is the last technique that we're going to cover in the course for translating a website crowding in context is great when you want your translators or your community to translate the strings that you currently have in a project in crowding directly on top of that website app or platform they can basically click on the string translated see a preview of the translation live on the website where it should be and the changes will be automatically synchronized between your a and crowding so I will show you the basics the fundamentals of how you can synchronize that and how you can set it up here we have our localized app example this is our basic react app here it's already running so I'm going to open this in my browser and we can see it over here free go gam welcome learn to code for free I just made a few modifications because now we will need to support multiple languages because we will have a pseudo language to configure all of this functionality a pseudo language will be like a template with additional information about the strings that crowding is going to use to get the information it needs for the translations so instead of here saying English or Spanish I am just showing the twet code English Spanish and we're going to use Africans as a pseudo language this the pseudo language should be a language that you're not planning to translate your content into Okay so so if I'm not planning to translate my website into Africans then I can use that because the language itself will not be available it will be used for placeholders that crowding will need to get the translations live and synchronize them let me show you the changes I made to the code compared to the previous versions because now we are supporting multiple languages here in the unchange method now I am setting the language to the value of the current Target the option that the user selects from the drop- down menu and it will be one of these values en N es s or AF I added this third option for Africans because to enable crowding in context you or the user the translator has to select that particular language to activate the entire functionality okay so that's one of the changes and the other change is here in the initial State instead of English now I have en n which is the twet code for English since all of that is set up we need to go to crowding Enterprise and here I have a project named free code cam in context tutorial these are the target languages I selected Bengali French Hindi Japanese and Spanish this feature is available for teams and for crowning Enterprise if you're representing an open source project an organization or an educational project then you will be able to configure this in your project to do that go to sources and here we need to upload the file where we are storing the strings that we want to translate we're going to do that manually for the purposes of this demo of this simple example but you can automate this with the techniques we've seen you can add the GitHub integration and synchronize all the files you need automatically for now I am just going to go to this folder or I can also go to my vs code over here where I have my files and I'm going to take my main. Json file where I'm storing all the strings the original strings the English strings to upload the file by dragging and dropping it I am going to right click on it I am going to open it or reveal it in finder I'm using Mac OS in Windows you also have an option to see the path to the file and open it and here I'm going to drag and drop it to this area that will start the upload and once the upload is completed you will you will be able to go here to the tools in the tools you will find in context over here if you click on it you will reach this part in context for web crowding in context tool provides an overlay for your application translators can make translation in context and instantly preview them by default it will be disabled if you want to enable it just click on this button and then it will change to enabled and here you see the two steps that you need to follow it's it's actually quite simple let me show you the first step is to integrate a new language into your application since localization and translation is very technology specific there are many ways to do this I'm just showing you a simple example with a react app and the I next framework but this will depend on the technology that you are using for your application to enable in context localization you will have to switch your application to this language so if if you have some way of switching the language of your application like a drop down menu or a query parameter or any other approach then you will need to switch to that language that we're integrating here this is a pseudo language like you can see over here we need to integrate that but we have to choose it first this should be a language that you're not planning to translate your content into so in this case I'm going to choose just as an example Africans you could choose any other language that you're not planning to translate you can choose if you also want to translate hidden strings or disable this I'm going to keep it enabled it's enabled by default and you can see here the twet code of the language you selected and the local code this option should be disabled if hidden strings are used for metadata and should be original for the web or the apps functioning okay something to be aware of so after that we click on download and then we open a folder that we downloaded this will be a zip file we just need to unzip it the folder will be named AF when you unzip it and inside that folder you will have a main. Json file this is a file that you have to add to your application in some way depending on how you're structuring your file where you're storing your translations and your locals if we check the content of the file you will see that it's actually quite interesting if we go back to visual studio code we just need to drag and drop this folder here into my local folder which is where I'm storing all the translations it should be at the same level as my English folder let me just make this full screen now we have two languages we have English and we have Africans if we open the Africans Json file you will see that it's not actually translating them into Africans it's just giving them crowding specific identifiers for crowding in context so that's why why you shouldn't plan to translate your application into this pseudo language so choose it carefully when you set this up after you have that you also need to make sure that the application will handle switching to this language appropriately right now if I go to my application I can see that I added the option for afcons and it will handle it correctly like this now if we switch to this language instead of the translations because we don't have them we see just the crowding identify but this is not working yet because we need to take a second step if we go back to crowding Enterprise now we go to the JavaScript snippet setup we need to paste this JavaScript snippet in our head section in the head section of the HTML document or the document that you're working with before any other scripts every page it's important to read this every page with a localizable text should contain this script you can also include this JavaScript snippet only when the pseudo language is active so let's copy this and let's paste it where we need it to be they mentioned that it should be in the head section of the application in a react up that would be in index.html this would be the head element so after that after I'm going to place them below the title here and I'm going to fix the the indentation like this it's just this couple of script texts and that will create all the magic you can see that we have like a code for the project and a domain and we also see this script with a specific Source from crowding CDN the content delivery Network so now if we go back to our react application now we see something special over here you may see this warning first because there is nothing to translate with crowning in context because we're not in the Africans language yet by default we are in English in the application so if you ever see this just click on close you might also read this to know what would be causing it but if it's not an issue really you can just close it and here you can see this preview we see this preview and we can move it anywhere we need to and what are we seeing here well we see all the strings that we can translate for that specific page we're in we can also type to search for a specific string we see like a summary for the left panel of the crowding editor tool but it's right there directly on top of our application we can also click here to take a screenshot of the current screen and upload it to crowding and we also have some settings you might also get a signin screen the first time you launch your application where you will need to choose your target language and you will need to log into crowding and then go back to your application I have I've already done that in this computer so that's why it's not asking me again to sign in for the same application but here I do see croing in context and I can change those settings here in the settings tab the language the target language is Spanish I can also change this if I'm going to translate to a different target language at the moment I cannot select a workflow step from my Enterprise workflow I can change this preview the translations or not highlight them and list only text from the current page I can also log out from my account and let me show you this I'm going to log out momentarily and then log back in so you can see how this works I'm going to log out and this is exactly what you will see when you launch your application this is the target language you need to choose it and the workflow step and then you log in with your crowding account you will be redirected to your crowding account you can send a magic link if you want to and after you click on the magic link you you will be redirected to your react application where you can start translating exactly what we had before right but now when you start translating what happens if you switch to Africans which is the pseudo language well the pseudo language will enable the overlay on your app and you will be able to click here on this little icon next to the string that you want to translate this will open like a more compact version of the editor where you can submit your Translate you will need to use cookies you can customize them reject them or accept them I'm going to accept them and here you can write your translations let me translate this welcome I'm going to translate it like this and then if I save my translation you will see what happens instead of being red now it's green because I translated it and if I have the permissions I can also approve it as a prove reader once it's approved I will see a check mark I will see all the revision history here as well and if I go to my project in crowding Enterprise now if I go to the dashboard I can see that there is a progress here 9% in the Spanish translations let me continue translating this I'm going to save this then I'm going to translate this like this and then I can just approve them as a proof reader and it will be synchronized automatically now you can see a green dotted line around the strings in the overlay and we can see the preview over here if we switch the language to Spanish we are not seeing this the translations because right now we don't have that locally in our project but we do have them over here in our project so if I choose to download this Json file in Spanish like this main. Json I can just download it I'm doing all of this manually of course but you can automate this with all the tools you learned before I can drag and drop the file in Spanish over here to the folder and now if I refresh this in the application I will be able to switch to the Spanish version very easily with the translations I just saved but crowning in context will be activated for specifically Africans when you select Africans if you want to translate into another target language let's say Japanese now I can change this to Japanese while I'm still selecting the Africans language in my app if I want to change the target language I need to make sure that I click here on change okay that will change the strings that I am the status of the strings that I'm translating because they will be the same for all the languages but they statuses will be different or might be different let's say that I'm going to translate into Japanese I personally don't speak Japanese but I'm going to use this machine translation I'm not sure if this is 100% accurate but let's save it so you can see how it works and now I submitted it and approved it and you can see how the status is being updated now if we go to Africans we can see the preview of the translation in Japanese and if we go back to our project in crowding and and we refresh this we see a progress in Japanese we see 9% now if we go to main. Json in crowding we can see that this translation was successfully saved and approved and we can also work from here from the main editor in crowding or in crowding in context so we have these two options and it's always great to see what We're translating in the context of the real application great now you know how to set this up this process is a bit more detailed and it really depends on how you structured and configure your app and the framework that you're using for internationalization in this case I was using IAT next for react react IAT next but for every framework you just need to check where you're storing your translations then choose a pseudo language download the file upload your original strings files then download the file for your pseudo language the pseudo language that you chose from crowding and then follow the steps that we just saw please feel free to review this part of the course to set this up in your own application and the crowding team is also available if you need help here in the tools panel if you go to in contacts for web at the bottom you can see that if you need assistance with any of the stages above you can contact the crowding team if you need any help but these are the two main steps awesome now you know how to work with crowding in context for web awesome congratulations on reaching this part of the course now that you know how to translate your project on crowding let's see how free Cam's Community is translating the content into many world languages we'll see this from a potential contributors point of view emphasizing how to translate our content on crowding so this time we will see this from a contributor's point of view how you as a contributor can translate resources for free code Camp if you are a contributor who is interested in joining our translation effort where should you start you should start by reading our contribution guidelines here we are in our contribution guidelines contribute to freec cam.org you can contribute in many different ways but here we're focusing on translation so you would click here on help us translate and you you will see this we are localizing free cam.org to Major World languages you can see all the languages that we have available right now if you're interested in translating here is how to translate free Cam's resources so you can click here on this link or you can click here on the sidebar on work on translating resources and that will take you to this article first of all prepare yourself for contributions there are no speed limits you can start by reading this announcement we recommend joining our community forum and our Discord chat server if you click on these links let me open them right here so you can see them you can find Quincy larsson's announcements Quincy Larson is the founder of free Cod cam he wrote this article to help you join the localization process how to help translate free code cam into your native language you can read this announcement this has the major steps that you should follow for the localization process and after after that you can also go to this link over here this is the community Forum the community forum is where you can ask questions we also have a Discord server that you can join you just need to choose your name and click on continue to join you will need to register and you will be taken to our Discord server where you can ask questions we have special rooms where you can talk about the localization process and get started you can transl as much as you want when you want it's only a matter of how much time and energy you are willing to invest as a volunteer translator we just ask you to understand the following translations are a team effort it is a fun and rewarding experience but it works best if you involve your friends and colleagues who speak the same language as you we also have the goal of providing education in as many languages as possible but it costs quite a lot to keep the engines running so Freo cam is committed to providing these for free as always but we need to prioritize resources for those who need it the most for translating the curriculum once a language reaches at least a few certifications we can begin deploying the language live on our learn platform where you can find the curriculum we looked at our user base and added 30 more than 30 most widely spoken languages to the list of enabled languages on the translations platform which is crowding we are definitely looking forward to adding more languages to the list but it would only be feasible if we get enough momentum around a language I am covering all of this really quickly you can go here to this link to how to translate files on fre Cod Cam's contribution guidelines to learn more about this and read this in more detail I'm just giving you a general overview now we go to the overview of crowding but of course you just watch the score so you know a lot about crowding let's just go through this really quickly to help us with this massive effort we have integrated our open-source codebase and curriculum with crowding a tool to help us localize our codebase we use a different tool and workflow for translating articles in the Publications okay so crowding is being used for the curriculum and code base the translation workflow is split into two main activities translating and prove reading and we saw those roles during the course right so now you're seeing all of these Concepts in a real world project everything that we saw is a part of the course is being applied here in a real project that is live with a global Community we translate curriculum files documentation and UI user interface elements like buttons labels and other elements you can sign up to our translation platform and contribute with any of the 30 languages more than 30 languages enabled in the platform you can also be a proof reader to verify the translations to get started you should say hi in our this score where we publish updates then head to our translation platform and log in okay let's open up our translation platform here if you click on this link you will see that once you're in here in crowding in our project you will see these three featured projects coding curriculum user interface and documentation we also have other projects but these are the main ones you will also find an about tab where you can find more information about free code camp in the open project you will need to click on one of these projects let's say that you want to contribute to the coding curriculum once you're in there you will find many different elements first of all you will notice a list with all the languages that we have enabled more than 30 languages and you will see their status here on their status bar here you can see the number of words to translate in each language you can see the progress here on the progress bar you can see that the green bar represents how many strings have been approved approved means that they have been translated and pro read and then the approved reader approved the string to be live and we also have a blue bar that represents how many strings have been translated how many words have been translated let's say that we want to check the project for Spanish if we click on this language and we see Spanish modern we go into that project specifically and we can see all the files that we can translate we see the project structure if you need to collapse or close a specific folder you just click here on the small arrow and you will be able to expand or collapse that folder the files will still be there but you will not see them it might take a while but after that you will see the progress of each file as well and you can see them here as numbers and if you want to start contributing or translating then you would also need to choose a file to choose a file let's say just to click on a random file let's choose one from this certification scientific Computing with python let's just click here and if you click here on a file you will be taken to a login page you can log in over here into crowding Enterprise and you will need to log in into crowding Enterprise to have access to free code cam as an organization and to contribute to the project so you you enter your email or username you enter your password and then you log in you can also click here to get a magic link and you can log in with Google Facebook GitHub or your ex Twitter account if you're new to the project then you will need to sign up you can sign up by clicking here and then you will need to enter your email username and pass password agree to the terms and conditions and you may need to do some extra verification here for cloud fler and create your account I already have my account so let me just sign into this if you log in and you already have an account crowding will ask you if you want to stay logged in we can remember your session so you wouldn't need to log in as often you can choose to keep me logged in or not now I'm going to choose one of these options and then I go into the file that I selected because remember that we were in the free code cam coding curriculum project we clicked on a file and now we go to that file and we're back at the user interface that you are already familiar with after taking the course that is how you can start translating our resources technically how you can actually get to the resources if you go to our project again once you're logged in you will also be able to choose the the project you can log in from here after you log in if you don't see your profile here here you will see a login button that you can click on and after that you will see your profile image the organizations that you manage or that you're part of and your notifications as well but here let's say that I am in my account I already locked in I can go to the coding curriculum I can choose a file and now I will see some changes if I am logged into my account I will see go to editor and I will see these files it might take a while to load the progress of the files if you click here on hide completed you will not see the files that have been 100% translated and approved like for example here we have one of these files if you click on the button you will hide them that can be helpful as well to save you some time and reach a file that needs your help after that you also have the option to go to the editor if you click here you can go to the editor and help with strings that need help great that that is how you can start translating our coding curriculum but we also have other projects like the learn user interface and contributing documentation if you go there you will see the same project structure you will see the different managers you will see the same list of languages but you will see different files because that that is the version of the documentation that we are currently reading in the course okay if you would like to help with this you can also help us with this but the interface is very similar for all the projects now how can you translate the learn interface let's go back to our documentation if you would like to help translate the learn user interface like the buttons and the labels if you don't want to contribute to the curriculum and instead you would like to help translate the interface we also have a project for this and our documentation mentions that to translate the learn interface the interface relies on Json files remember Json this is another format that we talked about during the course it is loaded into uh an internationalization this is a numeronym the internationalization plugin to generate translated text this translation effort is split across both crowding and GitHub so if you are going to translate the learn interface you will need to read a little bit about this these Json files contain information that need to be updated to reflect your language but they cannot be uploaded into crowding as the content isn't something that would be a onetoone translation so these files will have to be maintained by your language lead but you're welcome to read about how to translate them in this link on crowding it's also important that you do not edit the following files through a GitHub pool request like these Json files intro and translations are translated on crowding in the project that we have for learn translating them can be a bit tricky as each individual Json value appears as its own string and sometimes the context is missing but the context information provided by crowding over here can help you understand where the string fits into the larger structure if you have any questions about a string you can reach out in the contributor chat that is about translating the learn interface because we have three main projects remember you can contribute to the coding curriculum the learn interface or the documentation translating the documentation is another essential task because this is the main resource that we use to explain contributors how to join free code Cam's Mission we share information steps and guidelines the the information that you are reading right now but we do have certain guidelines for translating our documentation our contributing documentation is powered by doif and we have special parsing for message boxes like this one so if you see this kind of string these words should not be translated and if you have any internal links you have to make sure that you replace them properly when you translate them because the internal links will be broken if you don't replace the ID of the target section with the ID of the translated document here we have an example here just make sure that the ID matches the ID of the element in your markdown files even after the translation so in the documentation we have many different details I'm just giving you a general overview of what you can expect right now we are focusing on these three main projects and finally we also find some best practices do not translate the content within the code text they indicate text that is found in code and should be left in English do not add any additional content if you feel a requires change in the text content or additional information you should propose the changes through a GitHub issue or a pull request that modifies the English file if you think that you need to change something in the challenge please do open a GitHub issue and do not change the order of the content okay to be consistent across languages if you have any questions you can also reach out on Discord and we will be happy to assist you at some point you may also want to become a proof reader right but how did you become a proof reader on free Cam's translation effort if we go down here we can find a section called becoming a proof reader if you have any questions or you're interested in becoming a proof reader feel free to reach out in our contributors chat room we will typically Grant you proof reading access if you have been contributing to free codam for a while so you'll need to contribute as a translator and then we can grant you proof reader access please note that crowding by default will allow you to to approve your translations if you become a proof reader however in general it's best to allow another proof reader to review your proposed translations as an extra safety measure to make sure that there are no errors awesome if you have any questions on the localization process or you would like to join our translation effort you're welcome to join our Discord chat server let me go back here we go to work on translating resources and here you can find the link Discord chat server there you can sign up create an account and contact us if you have any questions once you create your account and join the server you will see a welcome message with the start here localization Channel congratulations on reaching this part of the course you just completed the course and you're more familiar with the fundamentals of localization and how you can translate a project on crowding our localization management platform but the application that we buil and how we use the IAT next framework is just scratching the surface of everything that you can do with this amazing framework so here is a helpful tip for you you can go to IAT next.com to find the documentation for this framework there you will find a lot of information about the different features that it supports you can see that IAT next is an internationalization framework written in and for JavaScript but it's much more than that it goes beyond just providing the standard features such as plurals context interpolation and format it gives you a complete solution to localize your product from web to mobile and desktop here you can find a brief tutorial and you can see that this framework is compatible with many different JavaScript Frameworks and libraries it works with react angular VJs and many more you can also use I next with nodejs with Deno with PHP iOS Android and other platforms if we go here we can see all the supported Frameworks the list is not officially maintained so information here is contributed by the library maintainers themselves you can find more information here we can see that flutter also supports this for development for mobile apps react spelt next.js Angular JS angular here you can see that we do have some variations of the IAT next framework for example for react we worked with react IAT next and each one of them will have their own documentation but from the central website you can reach all of that information you have specific for angular for view jQuery HTML 5 and many more ember.js and the list just goes on and on like PHP rails it's very versatile and you have an entire ecosystem of libraries and fr Frameworks to work with which is always great if we dive deeper into the documentation we can see that we have a tutorial to get started with the framework you already know the basics but we used a very simplified approach for translating because our application was quite simple and it was a simple single page application this will give you more details about how you can use the framework like how you can use the API here in need and the different methods that you can call on the IAT next module like this here you can see a list of all those methods and if you click on them you can quickly scroll down or jump to that particular part of the documentation and they even include an example over here in JavaScript we also see the configuration options how we can pass the the options and a call back function you can find a lot of information about each one of these options over here a description we also see plugins and utils over here and we see typescript because you can use this framework with typescript as well here we also find information about the translation function like Essentials interpolation because with interpolation you can integrate Dynamic values into your translations that is great notice here like the basic interpolation example that we see over here we have the keys the key here and this string right but once we call the T we are going to pass this object and the value over here will be replaced where we find this interpolation in the original string so that is a great great feature working with data models as well you can also pass entire data models as a value for interpolation like this we have the author and you can pass it for interpolation over here there are many additional options that you can choose to work with you can find them in the documentation we also see formatting built-in formatting like plural rules list format display names number format local and date time format this is interesting because it will give you more information about how we can format these values we also see plurals over here how to handle the plurals with your keys how to handle nesting because with nesting you can reference other keys in a translation you can also add a context to differentiate the different translations for example you can provide gender specific translations and you can also work with objects and arrays to be used by third-party modules localization so you can find all of this information in the official documentation in the course I kept the example as simple as possible to make it General and as broad as possible for a wide community of Learners to get started but from here you can take this as your first step into the world of localization there's a lot to be covered here and you may dive into a more advanced course on IAT next I'm showing you like the basic principles and Concepts that you need to know you can also find best practices here that you should follow we also see translation resolution fallback name spaces and more advanced concepts this is for the IAT next framework in general but if you want to Di into a specific version of this framework like for example react you can go to react. next.com and here you will find the documentation and more information about this framework is specifically made for react and react native it's based on IAT next so you can find the general information over here in the general articles in documentation but you will also find specific information like the used translation hook that we used in our application you also have different components like the trans component and you can find a step-by-step guide on how to integrate it this is specifically for react but you can also go to the documentation of the framework for the technology that you are working with and after you dive into all the details of the localization framework you can also find more information about crowding where your translators or yourself are going to be working on the translations by going to crowding s base you can go here to support. crowding docomo here crowding KB where KB stands for knowledge base it's like their documentation where they keep all the details of their features and if you ever have any questions or doubts about how a feature works you can go here and check that in more detail you can see how how to create a project how to upload source files and they do have very helpful screenshots that you can check as well you can find translation strategies how you can manage a project project settings the translation process and the different features they have Integrations as well and for translators you can also find more information like a quick introduction to crowding information for volunteer translators and more information about crowdsourcing their account settings and how to join a translation project this is helpful as a an overview of the basic features for volunteer translators to get them started and ready to start translating your content they can also find more information about the translation process like the online editor with helpful screenshots and visual information so if you ever have any questions just go to crowding knowledge base and there you you will find the answers or of course you can always review the content of this course thank you so much for taking the course I hope you liked it and I hope you found it helpful for your localization project I will see you in a future course and I hope you have a great day\n"