From 362f0f75f85b4ee75623c6fe3c2593be46ee83bd Mon Sep 17 00:00:00 2001 From: Jay Nandu Katangaza Date: Thu, 15 Oct 2020 18:11:29 -0400 Subject: [PATCH] Add files via upload --- LICENSE | 350 +-- PULL_REQUEST_TEMPLATE.md | 22 +- README-CN.md | 374 +-- README-ES.md | 372 +-- README-JA.md | 374 +-- README-KO.md | 372 +-- README-PTBR.md | 370 +-- README-RU.md | 372 +-- README.md | 370 +-- src/react-developer-roadmap-cn.xml | 3814 ++++++++++++------------- src/react-developer-roadmap-es.xml | 3814 ++++++++++++------------- src/react-developer-roadmap-ja.xml | 3814 ++++++++++++------------- src/react-developer-roadmap-pt-br.xml | 3814 ++++++++++++------------- src/react-developer-roadmap-ru.xml | 3814 ++++++++++++------------- src/react-developer-roadmap.xml | 3814 ++++++++++++------------- translations/README-FR.md | 110 + translations/cn.json | 114 +- translations/es.json | 112 +- translations/ja.json | 104 +- translations/ko.json | 116 +- translations/pt-br.json | 112 +- translations/ru.json | 116 +- translations/translate.js | 86 +- 23 files changed, 13420 insertions(+), 13310 deletions(-) create mode 100644 translations/README-FR.md diff --git a/LICENSE b/LICENSE index 4fd532b..cdfe4a2 100644 --- a/LICENSE +++ b/LICENSE @@ -1,175 +1,175 @@ -## creative commons - -# Attribution-NonCommercial-ShareAlike 4.0 International - -Creative Commons Corporation (“Creative Commons”) is not a law firm and does not provide legal services or legal advice. Distribution of Creative Commons public licenses does not create a lawyer-client or other relationship. Creative Commons makes its licenses and related information available on an “as-is” basis. Creative Commons gives no warranties regarding its licenses, any material licensed under their terms and conditions, or any related information. Creative Commons disclaims all liability for damages resulting from their use to the fullest extent possible. - -### Using Creative Commons Public Licenses - -Creative Commons public licenses provide a standard set of terms and conditions that creators and other rights holders may use to share original works of authorship and other material subject to copyright and certain other rights specified in the public license below. The following considerations are for informational purposes only, are not exhaustive, and do not form part of our licenses. - -* __Considerations for licensors:__ Our public licenses are intended for use by those authorized to give the public permission to use material in ways otherwise restricted by copyright and certain other rights. Our licenses are irrevocable. Licensors should read and understand the terms and conditions of the license they choose before applying it. Licensors should also secure all rights necessary before applying our licenses so that the public can reuse the material as expected. Licensors should clearly mark any material not subject to the license. This includes other CC-licensed material, or material used under an exception or limitation to copyright. [More considerations for licensors](http://wiki.creativecommons.org/Considerations_for_licensors_and_licensees#Considerations_for_licensors). - -* __Considerations for the public:__ By using one of our public licenses, a licensor grants the public permission to use the licensed material under specified terms and conditions. If the licensor’s permission is not necessary for any reason–for example, because of any applicable exception or limitation to copyright–then that use is not regulated by the license. Our licenses grant only permissions under copyright and certain other rights that a licensor has authority to grant. Use of the licensed material may still be restricted for other reasons, including because others have copyright or other rights in the material. A licensor may make special requests, such as asking that all changes be marked or described. Although not required by our licenses, you are encouraged to respect those requests where reasonable. [More considerations for the public](http://wiki.creativecommons.org/Considerations_for_licensors_and_licensees#Considerations_for_licensees). - -## Creative Commons Attribution-NonCommercial-ShareAlike 4.0 International Public License - -By exercising the Licensed Rights (defined below), You accept and agree to be bound by the terms and conditions of this Creative Commons Attribution-NonCommercial-ShareAlike 4.0 International Public License ("Public License"). To the extent this Public License may be interpreted as a contract, You are granted the Licensed Rights in consideration of Your acceptance of these terms and conditions, and the Licensor grants You such rights in consideration of benefits the Licensor receives from making the Licensed Material available under these terms and conditions. - -### Section 1 – Definitions. - -a. __Adapted Material__ means material subject to Copyright and Similar Rights that is derived from or based upon the Licensed Material and in which the Licensed Material is translated, altered, arranged, transformed, or otherwise modified in a manner requiring permission under the Copyright and Similar Rights held by the Licensor. For purposes of this Public License, where the Licensed Material is a musical work, performance, or sound recording, Adapted Material is always produced where the Licensed Material is synched in timed relation with a moving image. - -b. __Adapter's License__ means the license You apply to Your Copyright and Similar Rights in Your contributions to Adapted Material in accordance with the terms and conditions of this Public License. - -c. __BY-NC-SA Compatible License__ means a license listed at [creativecommons.org/compatiblelicenses](http://creativecommons.org/compatiblelicenses), approved by Creative Commons as essentially the equivalent of this Public License. - -d. __Copyright and Similar Rights__ means copyright and/or similar rights closely related to copyright including, without limitation, performance, broadcast, sound recording, and Sui Generis Database Rights, without regard to how the rights are labeled or categorized. For purposes of this Public License, the rights specified in Section 2(b)(1)-(2) are not Copyright and Similar Rights. - -e. __Effective Technological Measures__ means those measures that, in the absence of proper authority, may not be circumvented under laws fulfilling obligations under Article 11 of the WIPO Copyright Treaty adopted on December 20, 1996, and/or similar international agreements. - -f. __Exceptions and Limitations__ means fair use, fair dealing, and/or any other exception or limitation to Copyright and Similar Rights that applies to Your use of the Licensed Material. - -g. __License Elements__ means the license attributes listed in the name of a Creative Commons Public License. The License Elements of this Public License are Attribution, NonCommercial, and ShareAlike. - -h. __Licensed Material__ means the artistic or literary work, database, or other material to which the Licensor applied this Public License. - -i. __Licensed Rights__ means the rights granted to You subject to the terms and conditions of this Public License, which are limited to all Copyright and Similar Rights that apply to Your use of the Licensed Material and that the Licensor has authority to license. - -h. __Licensor__ means the individual(s) or entity(ies) granting rights under this Public License. - -i. __NonCommercial__ means not primarily intended for or directed towards commercial advantage or monetary compensation. For purposes of this Public License, the exchange of the Licensed Material for other material subject to Copyright and Similar Rights by digital file-sharing or similar means is NonCommercial provided there is no payment of monetary compensation in connection with the exchange. - -j. __Share__ means to provide material to the public by any means or process that requires permission under the Licensed Rights, such as reproduction, public display, public performance, distribution, dissemination, communication, or importation, and to make material available to the public including in ways that members of the public may access the material from a place and at a time individually chosen by them. - -k. __Sui Generis Database Rights__ means rights other than copyright resulting from Directive 96/9/EC of the European Parliament and of the Council of 11 March 1996 on the legal protection of databases, as amended and/or succeeded, as well as other essentially equivalent rights anywhere in the world. - -l. __You__ means the individual or entity exercising the Licensed Rights under this Public License. Your has a corresponding meaning. - -### Section 2 – Scope. - -a. ___License grant.___ - - 1. Subject to the terms and conditions of this Public License, the Licensor hereby grants You a worldwide, royalty-free, non-sublicensable, non-exclusive, irrevocable license to exercise the Licensed Rights in the Licensed Material to: - - A. reproduce and Share the Licensed Material, in whole or in part, for NonCommercial purposes only; and - - B. produce, reproduce, and Share Adapted Material for NonCommercial purposes only. - - 2. __Exceptions and Limitations.__ For the avoidance of doubt, where Exceptions and Limitations apply to Your use, this Public License does not apply, and You do not need to comply with its terms and conditions. - - 3. __Term.__ The term of this Public License is specified in Section 6(a). - - 4. __Media and formats; technical modifications allowed.__ The Licensor authorizes You to exercise the Licensed Rights in all media and formats whether now known or hereafter created, and to make technical modifications necessary to do so. The Licensor waives and/or agrees not to assert any right or authority to forbid You from making technical modifications necessary to exercise the Licensed Rights, including technical modifications necessary to circumvent Effective Technological Measures. For purposes of this Public License, simply making modifications authorized by this Section 2(a)(4) never produces Adapted Material. - - 5. __Downstream recipients.__ - - A. __Offer from the Licensor – Licensed Material.__ Every recipient of the Licensed Material automatically receives an offer from the Licensor to exercise the Licensed Rights under the terms and conditions of this Public License. - - B. __Additional offer from the Licensor – Adapted Material.__ Every recipient of Adapted Material from You automatically receives an offer from the Licensor to exercise the Licensed Rights in the Adapted Material under the conditions of the Adapter’s License You apply. - - C. __No downstream restrictions.__ You may not offer or impose any additional or different terms or conditions on, or apply any Effective Technological Measures to, the Licensed Material if doing so restricts exercise of the Licensed Rights by any recipient of the Licensed Material. - - 6. __No endorsement.__ Nothing in this Public License constitutes or may be construed as permission to assert or imply that You are, or that Your use of the Licensed Material is, connected with, or sponsored, endorsed, or granted official status by, the Licensor or others designated to receive attribution as provided in Section 3(a)(1)(A)(i). - -b. ___Other rights.___ - - 1. Moral rights, such as the right of integrity, are not licensed under this Public License, nor are publicity, privacy, and/or other similar personality rights; however, to the extent possible, the Licensor waives and/or agrees not to assert any such rights held by the Licensor to the limited extent necessary to allow You to exercise the Licensed Rights, but not otherwise. - - 2. Patent and trademark rights are not licensed under this Public License. - - 3. To the extent possible, the Licensor waives any right to collect royalties from You for the exercise of the Licensed Rights, whether directly or through a collecting society under any voluntary or waivable statutory or compulsory licensing scheme. In all other cases the Licensor expressly reserves any right to collect such royalties, including when the Licensed Material is used other than for NonCommercial purposes. - -### Section 3 – License Conditions. - -Your exercise of the Licensed Rights is expressly made subject to the following conditions. - -a. ___Attribution.___ - - 1. If You Share the Licensed Material (including in modified form), You must: - - A. retain the following if it is supplied by the Licensor with the Licensed Material: - - i. identification of the creator(s) of the Licensed Material and any others designated to receive attribution, in any reasonable manner requested by the Licensor (including by pseudonym if designated); - - ii. a copyright notice; - - iii. a notice that refers to this Public License; - - iv. a notice that refers to the disclaimer of warranties; - - v. a URI or hyperlink to the Licensed Material to the extent reasonably practicable; - - B. indicate if You modified the Licensed Material and retain an indication of any previous modifications; and - - C. indicate the Licensed Material is licensed under this Public License, and include the text of, or the URI or hyperlink to, this Public License. - - 2. You may satisfy the conditions in Section 3(a)(1) in any reasonable manner based on the medium, means, and context in which You Share the Licensed Material. For example, it may be reasonable to satisfy the conditions by providing a URI or hyperlink to a resource that includes the required information. - - 3. If requested by the Licensor, You must remove any of the information required by Section 3(a)(1)(A) to the extent reasonably practicable. - -b. ___ShareAlike.___ - -In addition to the conditions in Section 3(a), if You Share Adapted Material You produce, the following conditions also apply. - -1. The Adapter’s License You apply must be a Creative Commons license with the same License Elements, this version or later, or a BY-NC-SA Compatible License. - -2. You must include the text of, or the URI or hyperlink to, the Adapter's License You apply. You may satisfy this condition in any reasonable manner based on the medium, means, and context in which You Share Adapted Material. - -3. You may not offer or impose any additional or different terms or conditions on, or apply any Effective Technological Measures to, Adapted Material that restrict exercise of the rights granted under the Adapter's License You apply. - -### Section 4 – Sui Generis Database Rights. - -Where the Licensed Rights include Sui Generis Database Rights that apply to Your use of the Licensed Material: - -a. for the avoidance of doubt, Section 2(a)(1) grants You the right to extract, reuse, reproduce, and Share all or a substantial portion of the contents of the database for NonCommercial purposes only; - -b. if You include all or a substantial portion of the database contents in a database in which You have Sui Generis Database Rights, then the database in which You have Sui Generis Database Rights (but not its individual contents) is Adapted Material, including for purposes of Section 3(b); and - -c. You must comply with the conditions in Section 3(a) if You Share all or a substantial portion of the contents of the database. - -For the avoidance of doubt, this Section 4 supplements and does not replace Your obligations under this Public License where the Licensed Rights include other Copyright and Similar Rights. - -### Section 5 – Disclaimer of Warranties and Limitation of Liability. - -a. __Unless otherwise separately undertaken by the Licensor, to the extent possible, the Licensor offers the Licensed Material as-is and as-available, and makes no representations or warranties of any kind concerning the Licensed Material, whether express, implied, statutory, or other. This includes, without limitation, warranties of title, merchantability, fitness for a particular purpose, non-infringement, absence of latent or other defects, accuracy, or the presence or absence of errors, whether or not known or discoverable. Where disclaimers of warranties are not allowed in full or in part, this disclaimer may not apply to You.__ - -b. __To the extent possible, in no event will the Licensor be liable to You on any legal theory (including, without limitation, negligence) or otherwise for any direct, special, indirect, incidental, consequential, punitive, exemplary, or other losses, costs, expenses, or damages arising out of this Public License or use of the Licensed Material, even if the Licensor has been advised of the possibility of such losses, costs, expenses, or damages. Where a limitation of liability is not allowed in full or in part, this limitation may not apply to You.__ - -c. The disclaimer of warranties and limitation of liability provided above shall be interpreted in a manner that, to the extent possible, most closely approximates an absolute disclaimer and waiver of all liability. - -### Section 6 – Term and Termination. - -a. This Public License applies for the term of the Copyright and Similar Rights licensed here. However, if You fail to comply with this Public License, then Your rights under this Public License terminate automatically. - -b. Where Your right to use the Licensed Material has terminated under Section 6(a), it reinstates: - - 1. automatically as of the date the violation is cured, provided it is cured within 30 days of Your discovery of the violation; or - - 2. upon express reinstatement by the Licensor. - - For the avoidance of doubt, this Section 6(b) does not affect any right the Licensor may have to seek remedies for Your violations of this Public License. - -c. For the avoidance of doubt, the Licensor may also offer the Licensed Material under separate terms or conditions or stop distributing the Licensed Material at any time; however, doing so will not terminate this Public License. - -d. Sections 1, 5, 6, 7, and 8 survive termination of this Public License. - -### Section 7 – Other Terms and Conditions. - -a. The Licensor shall not be bound by any additional or different terms or conditions communicated by You unless expressly agreed. - -b. Any arrangements, understandings, or agreements regarding the Licensed Material not stated herein are separate from and independent of the terms and conditions of this Public License. - -### Section 8 – Interpretation. - -a. For the avoidance of doubt, this Public License does not, and shall not be interpreted to, reduce, limit, restrict, or impose conditions on any use of the Licensed Material that could lawfully be made without permission under this Public License. - -b. To the extent possible, if any provision of this Public License is deemed unenforceable, it shall be automatically reformed to the minimum extent necessary to make it enforceable. If the provision cannot be reformed, it shall be severed from this Public License without affecting the enforceability of the remaining terms and conditions. - -c. No term or condition of this Public License will be waived and no failure to comply consented to unless expressly agreed to by the Licensor. - -d. Nothing in this Public License constitutes or may be interpreted as a limitation upon, or waiver of, any privileges and immunities that apply to the Licensor or You, including from the legal processes of any jurisdiction or authority. - -> Creative Commons is not a party to its public licenses. Notwithstanding, Creative Commons may elect to apply one of its public licenses to material it publishes and in those instances will be considered the “Licensor.” Except for the limited purpose of indicating that material is shared under a Creative Commons public license or as otherwise permitted by the Creative Commons policies published at [creativecommons.org/policies](http://creativecommons.org/policies), Creative Commons does not authorize the use of the trademark “Creative Commons” or any other trademark or logo of Creative Commons without its prior written consent including, without limitation, in connection with any unauthorized modifications to any of its public licenses or any other arrangements, understandings, or agreements concerning use of licensed material. For the avoidance of doubt, this paragraph does not form part of the public licenses. -> -> Creative Commons may be contacted at creativecommons.org +## creative commons + +# Attribution-NonCommercial-ShareAlike 4.0 International + +Creative Commons Corporation (“Creative Commons”) is not a law firm and does not provide legal services or legal advice. Distribution of Creative Commons public licenses does not create a lawyer-client or other relationship. Creative Commons makes its licenses and related information available on an “as-is” basis. Creative Commons gives no warranties regarding its licenses, any material licensed under their terms and conditions, or any related information. Creative Commons disclaims all liability for damages resulting from their use to the fullest extent possible. + +### Using Creative Commons Public Licenses + +Creative Commons public licenses provide a standard set of terms and conditions that creators and other rights holders may use to share original works of authorship and other material subject to copyright and certain other rights specified in the public license below. The following considerations are for informational purposes only, are not exhaustive, and do not form part of our licenses. + +* __Considerations for licensors:__ Our public licenses are intended for use by those authorized to give the public permission to use material in ways otherwise restricted by copyright and certain other rights. Our licenses are irrevocable. Licensors should read and understand the terms and conditions of the license they choose before applying it. Licensors should also secure all rights necessary before applying our licenses so that the public can reuse the material as expected. Licensors should clearly mark any material not subject to the license. This includes other CC-licensed material, or material used under an exception or limitation to copyright. [More considerations for licensors](http://wiki.creativecommons.org/Considerations_for_licensors_and_licensees#Considerations_for_licensors). + +* __Considerations for the public:__ By using one of our public licenses, a licensor grants the public permission to use the licensed material under specified terms and conditions. If the licensor’s permission is not necessary for any reason–for example, because of any applicable exception or limitation to copyright–then that use is not regulated by the license. Our licenses grant only permissions under copyright and certain other rights that a licensor has authority to grant. Use of the licensed material may still be restricted for other reasons, including because others have copyright or other rights in the material. A licensor may make special requests, such as asking that all changes be marked or described. Although not required by our licenses, you are encouraged to respect those requests where reasonable. [More considerations for the public](http://wiki.creativecommons.org/Considerations_for_licensors_and_licensees#Considerations_for_licensees). + +## Creative Commons Attribution-NonCommercial-ShareAlike 4.0 International Public License + +By exercising the Licensed Rights (defined below), You accept and agree to be bound by the terms and conditions of this Creative Commons Attribution-NonCommercial-ShareAlike 4.0 International Public License ("Public License"). To the extent this Public License may be interpreted as a contract, You are granted the Licensed Rights in consideration of Your acceptance of these terms and conditions, and the Licensor grants You such rights in consideration of benefits the Licensor receives from making the Licensed Material available under these terms and conditions. + +### Section 1 – Definitions. + +a. __Adapted Material__ means material subject to Copyright and Similar Rights that is derived from or based upon the Licensed Material and in which the Licensed Material is translated, altered, arranged, transformed, or otherwise modified in a manner requiring permission under the Copyright and Similar Rights held by the Licensor. For purposes of this Public License, where the Licensed Material is a musical work, performance, or sound recording, Adapted Material is always produced where the Licensed Material is synched in timed relation with a moving image. + +b. __Adapter's License__ means the license You apply to Your Copyright and Similar Rights in Your contributions to Adapted Material in accordance with the terms and conditions of this Public License. + +c. __BY-NC-SA Compatible License__ means a license listed at [creativecommons.org/compatiblelicenses](http://creativecommons.org/compatiblelicenses), approved by Creative Commons as essentially the equivalent of this Public License. + +d. __Copyright and Similar Rights__ means copyright and/or similar rights closely related to copyright including, without limitation, performance, broadcast, sound recording, and Sui Generis Database Rights, without regard to how the rights are labeled or categorized. For purposes of this Public License, the rights specified in Section 2(b)(1)-(2) are not Copyright and Similar Rights. + +e. __Effective Technological Measures__ means those measures that, in the absence of proper authority, may not be circumvented under laws fulfilling obligations under Article 11 of the WIPO Copyright Treaty adopted on December 20, 1996, and/or similar international agreements. + +f. __Exceptions and Limitations__ means fair use, fair dealing, and/or any other exception or limitation to Copyright and Similar Rights that applies to Your use of the Licensed Material. + +g. __License Elements__ means the license attributes listed in the name of a Creative Commons Public License. The License Elements of this Public License are Attribution, NonCommercial, and ShareAlike. + +h. __Licensed Material__ means the artistic or literary work, database, or other material to which the Licensor applied this Public License. + +i. __Licensed Rights__ means the rights granted to You subject to the terms and conditions of this Public License, which are limited to all Copyright and Similar Rights that apply to Your use of the Licensed Material and that the Licensor has authority to license. + +h. __Licensor__ means the individual(s) or entity(ies) granting rights under this Public License. + +i. __NonCommercial__ means not primarily intended for or directed towards commercial advantage or monetary compensation. For purposes of this Public License, the exchange of the Licensed Material for other material subject to Copyright and Similar Rights by digital file-sharing or similar means is NonCommercial provided there is no payment of monetary compensation in connection with the exchange. + +j. __Share__ means to provide material to the public by any means or process that requires permission under the Licensed Rights, such as reproduction, public display, public performance, distribution, dissemination, communication, or importation, and to make material available to the public including in ways that members of the public may access the material from a place and at a time individually chosen by them. + +k. __Sui Generis Database Rights__ means rights other than copyright resulting from Directive 96/9/EC of the European Parliament and of the Council of 11 March 1996 on the legal protection of databases, as amended and/or succeeded, as well as other essentially equivalent rights anywhere in the world. + +l. __You__ means the individual or entity exercising the Licensed Rights under this Public License. Your has a corresponding meaning. + +### Section 2 – Scope. + +a. ___License grant.___ + + 1. Subject to the terms and conditions of this Public License, the Licensor hereby grants You a worldwide, royalty-free, non-sublicensable, non-exclusive, irrevocable license to exercise the Licensed Rights in the Licensed Material to: + + A. reproduce and Share the Licensed Material, in whole or in part, for NonCommercial purposes only; and + + B. produce, reproduce, and Share Adapted Material for NonCommercial purposes only. + + 2. __Exceptions and Limitations.__ For the avoidance of doubt, where Exceptions and Limitations apply to Your use, this Public License does not apply, and You do not need to comply with its terms and conditions. + + 3. __Term.__ The term of this Public License is specified in Section 6(a). + + 4. __Media and formats; technical modifications allowed.__ The Licensor authorizes You to exercise the Licensed Rights in all media and formats whether now known or hereafter created, and to make technical modifications necessary to do so. The Licensor waives and/or agrees not to assert any right or authority to forbid You from making technical modifications necessary to exercise the Licensed Rights, including technical modifications necessary to circumvent Effective Technological Measures. For purposes of this Public License, simply making modifications authorized by this Section 2(a)(4) never produces Adapted Material. + + 5. __Downstream recipients.__ + + A. __Offer from the Licensor – Licensed Material.__ Every recipient of the Licensed Material automatically receives an offer from the Licensor to exercise the Licensed Rights under the terms and conditions of this Public License. + + B. __Additional offer from the Licensor – Adapted Material.__ Every recipient of Adapted Material from You automatically receives an offer from the Licensor to exercise the Licensed Rights in the Adapted Material under the conditions of the Adapter’s License You apply. + + C. __No downstream restrictions.__ You may not offer or impose any additional or different terms or conditions on, or apply any Effective Technological Measures to, the Licensed Material if doing so restricts exercise of the Licensed Rights by any recipient of the Licensed Material. + + 6. __No endorsement.__ Nothing in this Public License constitutes or may be construed as permission to assert or imply that You are, or that Your use of the Licensed Material is, connected with, or sponsored, endorsed, or granted official status by, the Licensor or others designated to receive attribution as provided in Section 3(a)(1)(A)(i). + +b. ___Other rights.___ + + 1. Moral rights, such as the right of integrity, are not licensed under this Public License, nor are publicity, privacy, and/or other similar personality rights; however, to the extent possible, the Licensor waives and/or agrees not to assert any such rights held by the Licensor to the limited extent necessary to allow You to exercise the Licensed Rights, but not otherwise. + + 2. Patent and trademark rights are not licensed under this Public License. + + 3. To the extent possible, the Licensor waives any right to collect royalties from You for the exercise of the Licensed Rights, whether directly or through a collecting society under any voluntary or waivable statutory or compulsory licensing scheme. In all other cases the Licensor expressly reserves any right to collect such royalties, including when the Licensed Material is used other than for NonCommercial purposes. + +### Section 3 – License Conditions. + +Your exercise of the Licensed Rights is expressly made subject to the following conditions. + +a. ___Attribution.___ + + 1. If You Share the Licensed Material (including in modified form), You must: + + A. retain the following if it is supplied by the Licensor with the Licensed Material: + + i. identification of the creator(s) of the Licensed Material and any others designated to receive attribution, in any reasonable manner requested by the Licensor (including by pseudonym if designated); + + ii. a copyright notice; + + iii. a notice that refers to this Public License; + + iv. a notice that refers to the disclaimer of warranties; + + v. a URI or hyperlink to the Licensed Material to the extent reasonably practicable; + + B. indicate if You modified the Licensed Material and retain an indication of any previous modifications; and + + C. indicate the Licensed Material is licensed under this Public License, and include the text of, or the URI or hyperlink to, this Public License. + + 2. You may satisfy the conditions in Section 3(a)(1) in any reasonable manner based on the medium, means, and context in which You Share the Licensed Material. For example, it may be reasonable to satisfy the conditions by providing a URI or hyperlink to a resource that includes the required information. + + 3. If requested by the Licensor, You must remove any of the information required by Section 3(a)(1)(A) to the extent reasonably practicable. + +b. ___ShareAlike.___ + +In addition to the conditions in Section 3(a), if You Share Adapted Material You produce, the following conditions also apply. + +1. The Adapter’s License You apply must be a Creative Commons license with the same License Elements, this version or later, or a BY-NC-SA Compatible License. + +2. You must include the text of, or the URI or hyperlink to, the Adapter's License You apply. You may satisfy this condition in any reasonable manner based on the medium, means, and context in which You Share Adapted Material. + +3. You may not offer or impose any additional or different terms or conditions on, or apply any Effective Technological Measures to, Adapted Material that restrict exercise of the rights granted under the Adapter's License You apply. + +### Section 4 – Sui Generis Database Rights. + +Where the Licensed Rights include Sui Generis Database Rights that apply to Your use of the Licensed Material: + +a. for the avoidance of doubt, Section 2(a)(1) grants You the right to extract, reuse, reproduce, and Share all or a substantial portion of the contents of the database for NonCommercial purposes only; + +b. if You include all or a substantial portion of the database contents in a database in which You have Sui Generis Database Rights, then the database in which You have Sui Generis Database Rights (but not its individual contents) is Adapted Material, including for purposes of Section 3(b); and + +c. You must comply with the conditions in Section 3(a) if You Share all or a substantial portion of the contents of the database. + +For the avoidance of doubt, this Section 4 supplements and does not replace Your obligations under this Public License where the Licensed Rights include other Copyright and Similar Rights. + +### Section 5 – Disclaimer of Warranties and Limitation of Liability. + +a. __Unless otherwise separately undertaken by the Licensor, to the extent possible, the Licensor offers the Licensed Material as-is and as-available, and makes no representations or warranties of any kind concerning the Licensed Material, whether express, implied, statutory, or other. This includes, without limitation, warranties of title, merchantability, fitness for a particular purpose, non-infringement, absence of latent or other defects, accuracy, or the presence or absence of errors, whether or not known or discoverable. Where disclaimers of warranties are not allowed in full or in part, this disclaimer may not apply to You.__ + +b. __To the extent possible, in no event will the Licensor be liable to You on any legal theory (including, without limitation, negligence) or otherwise for any direct, special, indirect, incidental, consequential, punitive, exemplary, or other losses, costs, expenses, or damages arising out of this Public License or use of the Licensed Material, even if the Licensor has been advised of the possibility of such losses, costs, expenses, or damages. Where a limitation of liability is not allowed in full or in part, this limitation may not apply to You.__ + +c. The disclaimer of warranties and limitation of liability provided above shall be interpreted in a manner that, to the extent possible, most closely approximates an absolute disclaimer and waiver of all liability. + +### Section 6 – Term and Termination. + +a. This Public License applies for the term of the Copyright and Similar Rights licensed here. However, if You fail to comply with this Public License, then Your rights under this Public License terminate automatically. + +b. Where Your right to use the Licensed Material has terminated under Section 6(a), it reinstates: + + 1. automatically as of the date the violation is cured, provided it is cured within 30 days of Your discovery of the violation; or + + 2. upon express reinstatement by the Licensor. + + For the avoidance of doubt, this Section 6(b) does not affect any right the Licensor may have to seek remedies for Your violations of this Public License. + +c. For the avoidance of doubt, the Licensor may also offer the Licensed Material under separate terms or conditions or stop distributing the Licensed Material at any time; however, doing so will not terminate this Public License. + +d. Sections 1, 5, 6, 7, and 8 survive termination of this Public License. + +### Section 7 – Other Terms and Conditions. + +a. The Licensor shall not be bound by any additional or different terms or conditions communicated by You unless expressly agreed. + +b. Any arrangements, understandings, or agreements regarding the Licensed Material not stated herein are separate from and independent of the terms and conditions of this Public License. + +### Section 8 – Interpretation. + +a. For the avoidance of doubt, this Public License does not, and shall not be interpreted to, reduce, limit, restrict, or impose conditions on any use of the Licensed Material that could lawfully be made without permission under this Public License. + +b. To the extent possible, if any provision of this Public License is deemed unenforceable, it shall be automatically reformed to the minimum extent necessary to make it enforceable. If the provision cannot be reformed, it shall be severed from this Public License without affecting the enforceability of the remaining terms and conditions. + +c. No term or condition of this Public License will be waived and no failure to comply consented to unless expressly agreed to by the Licensor. + +d. Nothing in this Public License constitutes or may be interpreted as a limitation upon, or waiver of, any privileges and immunities that apply to the Licensor or You, including from the legal processes of any jurisdiction or authority. + +> Creative Commons is not a party to its public licenses. Notwithstanding, Creative Commons may elect to apply one of its public licenses to material it publishes and in those instances will be considered the “Licensor.” Except for the limited purpose of indicating that material is shared under a Creative Commons public license or as otherwise permitted by the Creative Commons policies published at [creativecommons.org/policies](http://creativecommons.org/policies), Creative Commons does not authorize the use of the trademark “Creative Commons” or any other trademark or logo of Creative Commons without its prior written consent including, without limitation, in connection with any unauthorized modifications to any of its public licenses or any other arrangements, understandings, or agreements concerning use of licensed material. For the avoidance of doubt, this paragraph does not form part of the public licenses. +> +> Creative Commons may be contacted at creativecommons.org diff --git a/PULL_REQUEST_TEMPLATE.md b/PULL_REQUEST_TEMPLATE.md index 316dd18..f11c66c 100644 --- a/PULL_REQUEST_TEMPLATE.md +++ b/PULL_REQUEST_TEMPLATE.md @@ -1,11 +1,11 @@ -**What this PR does?** - - -**Why are you adding given library? (Short description why do you think that this library is important)** - - -**Screenshots (the part that you modified is enough)** - -Before: - -After changes: +**What this PR does?** + + +**Why are you adding given library? (Short description why do you think that this library is important)** + + +**Screenshots (the part that you modified is enough)** + +Before: + +After changes: diff --git a/README-CN.md b/README-CN.md index ce04082..dbb4581 100644 --- a/README-CN.md +++ b/README-CN.md @@ -1,187 +1,187 @@ -# React 开发者指南 - -[README in English](README.md) - -[README in Japanese](README-JA.md) - -[README in Korean](README-KO.md) - -[README in Portuguese (Brazil)](README-PTBR.md) - -[README in Russian](README-RU.md) - -[README in Spanish](README-ES.md) - -> 该指南将助你在 2019 成为一名 React 开发者 - -你可以在下面找到一张图，该图展示了你可以选取的路径及你想学习的库，从而成为一名 React 开发者。“作为 React 开发者，我接下来应该学习什么？”，我把这张图作为建议给每个问过我这一问题的人。 - -## 免责声明 - -> 该指南的目的是为了给你心有个大概的轮廓。如果你对接下来要学习的内容感到困惑，指南将指导你而不是鼓励你选择时髦和新颖的东西。 -> 你应该逐渐理解为什么一种工具比另一种工具更适合某些情况，并且记住时髦和新颖的东西并不总是意味着最适合这个工作。 - -## Roadmap - -![Roadmap](./roadmap-cn.png) - -## 资源 - -1. 基础 - 1. HTML - - 学习 HTML 基础知识 - - 做几个页面来练习 - 2. CSS - - 学习 CSS 基础知识 - - 完成上一步的样式页面 - - 使用 grid 布局和 flexbox 布局构建页面 - 3. JS 基础 - - 熟悉语法 - - 学习 DOM 的基本操作 - - 学习 JS 的典型机制（状态提升，事件冒泡，原型） - - 实现一些 AJAX（XHR）调用 - - 学习新特性 (ECMA Script 6+) - - 另外，熟悉 jQuery 库 -2. 常用开发技能 - 1. 学习 GIT 的使用, 在 GitHub 上创建一些仓库, 并和其他人分享你的代码 - 2. 掌握 HTTP(S) 协议, 及其请求方法 (GET, POST, PUT, PATCH, DELETE, OPTIONS) - 3. 不要害怕使用 Google, [使用 Google 进行强力搜索](http://www.powersearchingwithgoogle.com/) - 4. 熟悉终端，并配置你的 shell (bash, zsh, fish) - 5. 阅读一些关于算法和数据结构的书籍 - 6. 阅读一些关于设计模式的书籍 -3. 在[官网](https://reactjs.org/tutorial/tutorial.html)上学习 React 或者完成一些[课程](https://egghead.io/courses/the-beginner-s-guide-to-react) -4. 熟悉你将用到的工具 - 1. 包管理器 - - [npm](https://www.npmjs.com/) - - [yarn](https://yarnpkg.com/lang/en/) - - [pnpm](https://pnpm.js.org/) - 2. 任务运行器 - - [npm 脚本](https://docs.npmjs.com/misc/scripts) - - [gulp](https://gulpjs.com/) - - [Webpack](https://webpack.js.org/) - - [Rollup](https://rollupjs.org/guide/en) - - [Parcel](https://parceljs.org/) -5. 样式 - 1. CSS 预处理器 - - [Sass/CSS](https://sass-lang.com/) - - [PostCSS](https://postcss.org/) - - [Less](http://lesscss.org/) - - [Stylus](http://stylus-lang.com/) - 2. CSS 框架 - - [Bootstrap](https://getbootstrap.com/) - - [Materialize](https://materializecss.com/), [Material UI](https://material-ui.com/), [Material Design Lite](https://getmdl.io/) - - [Bulma](https://bulma.io/) - - [Semantic UI](https://semantic-ui.com/) - 3. CSS 架构 - - [BEM](http://getbem.com/) - - [CSS Modules](https://github.com/css-modules/css-modules) - - [Atomic](https://acss.io/) - - [OOCSS](https://github.com/stubbornella/oocss/wiki) - - [SMACSS](https://smacss.com/) - - [SUITCSS](https://suitcss.github.io/) - 4. JS 编写 CSS - - [Styled Components](https://www.styled-components.com/) - - [Radium](https://formidable.com/open-source/radium/) - - [Emotion](https://emotion.sh/) - - [JSS](http://cssinjs.org/) - - [Aphrodite](https://github.com/Khan/aphrodite) -6. 状态管理 - 1. [组件状态](https://reactjs.org/docs/faq-state.html)/[上下文 API](https://reactjs.org/docs/context.html) - 2. [Redux](https://redux.js.org/) - 1. 异步操作 (Side Effects) - - [Redux Thunk](https://github.com/reduxjs/redux-thunk) - - [Redux Better Promise](https://github.com/Lukasz-pluszczewski/redux-better-promise) - - [Redux Saga](https://redux-saga.js.org/) - - [Redux Observable](https://redux-observable.js.org) - 2. 助手 - * [Rematch](https://rematch.gitbooks.io/rematch/) - * [Reselect](https://github.com/reduxjs/reselect) - 3. 数据持久化 - - [Redux Persist](https://github.com/rt2zz/redux-persist) - - [Redux Phoenix](https://github.com/adam-golab/redux-phoenix) - 4. [Redux Form](https://redux-form.com) - 3. [MobX](https://mobx.js.org/) -7. 类型检查器 - - [PropTypes](https://reactjs.org/docs/typechecking-with-proptypes.html) - - [TypeScript](https://www.typescriptlang.org/) - - [Flow](https://flow.org/en/) -8. 表单助手 - - [Redux Form](https://redux-form.com) - - [Formik](https://github.com/jaredpalmer/formik) - - [Formsy](https://github.com/formsy/formsy-react) - - [Final Form](https://github.com/final-form/final-form) -9. 路由 - - [React-Router](https://reacttraining.com/react-router/) - - [Router5](https://router5.js.org/) - - [Redux-First Router](https://github.com/faceyspacey/redux-first-router) - - [Reach Router](https://reach.tech/router/) -10. API 客户端 - 1. REST - - [Fetch](https://developer.mozilla.org/en-US/docs/Web/API/Fetch_API) - - [SuperAgent](https://visionmedia.github.io/superagent/) - - [axios](https://github.com/axios/axios) - 2. GraphQL - - [Apollo](https://www.apollographql.com/docs/react/) - - [Relay](https://facebook.github.io/relay/) - - [urql](https://github.com/FormidableLabs/urql) -11. 实用工具库 - - [Lodash](https://lodash.com/) - - [Moment](https://momentjs.com/) - - [classnames](https://github.com/JedWatson/classnames) - - [Numeral](http://numeraljs.com/) - - [RxJS](http://reactivex.io/) - - [ImmutableJS](https://facebook.github.io/immutable-js/) - - [Ramda](https://ramdajs.com/) -12. 测试 - 1. 单元（Unit）测试 - - [Jest](https://facebook.github.io/jest/) - - [Enzyme](http://airbnb.io/enzyme/) - - [Sinon](http://sinonjs.org/) - - [Mocha](https://mochajs.org/) - - [Chai](http://www.chaijs.com/) - - [AVA](https://github.com/avajs/ava) - - [Tape](https://github.com/substack/tape) - 2. 端到端（E2E）测试 - - [Selenium](https://www.seleniumhq.org/), [Webdriver](http://webdriver.io/) - - [Cypress](https://cypress.io/) - - [Puppeteer](https://pptr.dev/) - - [Cucumber.js](https://github.com/cucumber/cucumber-js) - - [Nightwatch.js](http://nightwatchjs.org/) - 3. 集成测试 - - [Karma](https://karma-runner.github.io/) -13. 国际化（i18n) - - [React Intl](https://github.com/yahoo/react-intl) - - [React i18next](https://react.i18next.com/) -14. 服务端渲染（SSR) - - [Next.js](https://nextjs.org/) - - [After.js](https://github.com/jaredpalmer/after.js) - - [Rogue](https://github.com/alidcastano/rogue.js) -15. 静态网站生成器 - - [Gatsby](https://www.gatsbyjs.org/) -16. 后端集成框架 - - [React on Rails](https://shakacode.gitbooks.io/react-on-rails/content/) -17. 移动端 - - [React Native](https://facebook.github.io/react-native/) - - [Cordova](https://cordova.apache.org/)/[Phonegap](https://phonegap.com/) -18. 桌面端 - - [Proton Native](https://proton-native.js.org/) - - [Electron](https://electronjs.org/) - - [React Native Windows](https://github.com/Microsoft/react-native-windows) -19. 虚拟现实（VR) - - [React 360](https://facebook.github.io/react-360/) - -## 总结 - -如果你认为指南可以改进，请提交包含任何更新的 PR 并提交任何问题。此外，我将继续改进这个仓库，因此你可以 star 这个仓库以便于重新访问。 - -## 贡献 - -该指南是使用[Draw.io](https://www.draw.io/)构建的。项目文件可以在 `/src` 目录中找到。要修改它, 请打开 draw.io, 点击 **Open Existing Diagram** 并选择项目中的 `xml` 文件。它将为你打开指南，更新它，上传和更新自述文件中的图像并创建一个 PR（导出为 png）。 - -- 改进后提交 PR -- 讨论问题中的想法 -- 传播消息 - -## 版权许可 - -[![License: CC BY-NC-SA 4.0](https://img.shields.io/badge/License-CC%20BY--NC--SA%204.0-lightgrey.svg)](https://creativecommons.org/licenses/by-nc-sa/4.0/) +# React 开发者指南 + +[README in English](README.md) + +[README in Japanese](README-JA.md) + +[README in Korean](README-KO.md) + +[README in Portuguese (Brazil)](README-PTBR.md) + +[README in Russian](README-RU.md) + +[README in Spanish](README-ES.md) + +> 该指南将助你在 2019 成为一名 React 开发者 + +你可以在下面找到一张图，该图展示了你可以选取的路径及你想学习的库，从而成为一名 React 开发者。“作为 React 开发者，我接下来应该学习什么？”，我把这张图作为建议给每个问过我这一问题的人。 + +## 免责声明 + +> 该指南的目的是为了给你心有个大概的轮廓。如果你对接下来要学习的内容感到困惑，指南将指导你而不是鼓励你选择时髦和新颖的东西。 +> 你应该逐渐理解为什么一种工具比另一种工具更适合某些情况，并且记住时髦和新颖的东西并不总是意味着最适合这个工作。 + +## Roadmap + +![Roadmap](./roadmap-cn.png) + +## 资源 + +1. 基础 + 1. HTML + - 学习 HTML 基础知识 + - 做几个页面来练习 + 2. CSS + - 学习 CSS 基础知识 + - 完成上一步的样式页面 + - 使用 grid 布局和 flexbox 布局构建页面 + 3. JS 基础 + - 熟悉语法 + - 学习 DOM 的基本操作 + - 学习 JS 的典型机制（状态提升，事件冒泡，原型） + - 实现一些 AJAX（XHR）调用 + - 学习新特性 (ECMA Script 6+) + - 另外，熟悉 jQuery 库 +2. 常用开发技能 + 1. 学习 GIT 的使用, 在 GitHub 上创建一些仓库, 并和其他人分享你的代码 + 2. 掌握 HTTP(S) 协议, 及其请求方法 (GET, POST, PUT, PATCH, DELETE, OPTIONS) + 3. 不要害怕使用 Google, [使用 Google 进行强力搜索](http://www.powersearchingwithgoogle.com/) + 4. 熟悉终端，并配置你的 shell (bash, zsh, fish) + 5. 阅读一些关于算法和数据结构的书籍 + 6. 阅读一些关于设计模式的书籍 +3. 在[官网](https://reactjs.org/tutorial/tutorial.html)上学习 React 或者完成一些[课程](https://egghead.io/courses/the-beginner-s-guide-to-react) +4. 熟悉你将用到的工具 + 1. 包管理器 + - [npm](https://www.npmjs.com/) + - [yarn](https://yarnpkg.com/lang/en/) + - [pnpm](https://pnpm.js.org/) + 2. 任务运行器 + - [npm 脚本](https://docs.npmjs.com/misc/scripts) + - [gulp](https://gulpjs.com/) + - [Webpack](https://webpack.js.org/) + - [Rollup](https://rollupjs.org/guide/en) + - [Parcel](https://parceljs.org/) +5. 样式 + 1. CSS 预处理器 + - [Sass/CSS](https://sass-lang.com/) + - [PostCSS](https://postcss.org/) + - [Less](http://lesscss.org/) + - [Stylus](http://stylus-lang.com/) + 2. CSS 框架 + - [Bootstrap](https://getbootstrap.com/) + - [Materialize](https://materializecss.com/), [Material UI](https://material-ui.com/), [Material Design Lite](https://getmdl.io/) + - [Bulma](https://bulma.io/) + - [Semantic UI](https://semantic-ui.com/) + 3. CSS 架构 + - [BEM](http://getbem.com/) + - [CSS Modules](https://github.com/css-modules/css-modules) + - [Atomic](https://acss.io/) + - [OOCSS](https://github.com/stubbornella/oocss/wiki) + - [SMACSS](https://smacss.com/) + - [SUITCSS](https://suitcss.github.io/) + 4. JS 编写 CSS + - [Styled Components](https://www.styled-components.com/) + - [Radium](https://formidable.com/open-source/radium/) + - [Emotion](https://emotion.sh/) + - [JSS](http://cssinjs.org/) + - [Aphrodite](https://github.com/Khan/aphrodite) +6. 状态管理 + 1. [组件状态](https://reactjs.org/docs/faq-state.html)/[上下文 API](https://reactjs.org/docs/context.html) + 2. [Redux](https://redux.js.org/) + 1. 异步操作 (Side Effects) + - [Redux Thunk](https://github.com/reduxjs/redux-thunk) + - [Redux Better Promise](https://github.com/Lukasz-pluszczewski/redux-better-promise) + - [Redux Saga](https://redux-saga.js.org/) + - [Redux Observable](https://redux-observable.js.org) + 2. 助手 + * [Rematch](https://rematch.gitbooks.io/rematch/) + * [Reselect](https://github.com/reduxjs/reselect) + 3. 数据持久化 + - [Redux Persist](https://github.com/rt2zz/redux-persist) + - [Redux Phoenix](https://github.com/adam-golab/redux-phoenix) + 4. [Redux Form](https://redux-form.com) + 3. [MobX](https://mobx.js.org/) +7. 类型检查器 + - [PropTypes](https://reactjs.org/docs/typechecking-with-proptypes.html) + - [TypeScript](https://www.typescriptlang.org/) + - [Flow](https://flow.org/en/) +8. 表单助手 + - [Redux Form](https://redux-form.com) + - [Formik](https://github.com/jaredpalmer/formik) + - [Formsy](https://github.com/formsy/formsy-react) + - [Final Form](https://github.com/final-form/final-form) +9. 路由 + - [React-Router](https://reacttraining.com/react-router/) + - [Router5](https://router5.js.org/) + - [Redux-First Router](https://github.com/faceyspacey/redux-first-router) + - [Reach Router](https://reach.tech/router/) +10. API 客户端 + 1. REST + - [Fetch](https://developer.mozilla.org/en-US/docs/Web/API/Fetch_API) + - [SuperAgent](https://visionmedia.github.io/superagent/) + - [axios](https://github.com/axios/axios) + 2. GraphQL + - [Apollo](https://www.apollographql.com/docs/react/) + - [Relay](https://facebook.github.io/relay/) + - [urql](https://github.com/FormidableLabs/urql) +11. 实用工具库 + - [Lodash](https://lodash.com/) + - [Moment](https://momentjs.com/) + - [classnames](https://github.com/JedWatson/classnames) + - [Numeral](http://numeraljs.com/) + - [RxJS](http://reactivex.io/) + - [ImmutableJS](https://facebook.github.io/immutable-js/) + - [Ramda](https://ramdajs.com/) +12. 测试 + 1. 单元（Unit）测试 + - [Jest](https://facebook.github.io/jest/) + - [Enzyme](http://airbnb.io/enzyme/) + - [Sinon](http://sinonjs.org/) + - [Mocha](https://mochajs.org/) + - [Chai](http://www.chaijs.com/) + - [AVA](https://github.com/avajs/ava) + - [Tape](https://github.com/substack/tape) + 2. 端到端（E2E）测试 + - [Selenium](https://www.seleniumhq.org/), [Webdriver](http://webdriver.io/) + - [Cypress](https://cypress.io/) + - [Puppeteer](https://pptr.dev/) + - [Cucumber.js](https://github.com/cucumber/cucumber-js) + - [Nightwatch.js](http://nightwatchjs.org/) + 3. 集成测试 + - [Karma](https://karma-runner.github.io/) +13. 国际化（i18n) + - [React Intl](https://github.com/yahoo/react-intl) + - [React i18next](https://react.i18next.com/) +14. 服务端渲染（SSR) + - [Next.js](https://nextjs.org/) + - [After.js](https://github.com/jaredpalmer/after.js) + - [Rogue](https://github.com/alidcastano/rogue.js) +15. 静态网站生成器 + - [Gatsby](https://www.gatsbyjs.org/) +16. 后端集成框架 + - [React on Rails](https://shakacode.gitbooks.io/react-on-rails/content/) +17. 移动端 + - [React Native](https://facebook.github.io/react-native/) + - [Cordova](https://cordova.apache.org/)/[Phonegap](https://phonegap.com/) +18. 桌面端 + - [Proton Native](https://proton-native.js.org/) + - [Electron](https://electronjs.org/) + - [React Native Windows](https://github.com/Microsoft/react-native-windows) +19. 虚拟现实（VR) + - [React 360](https://facebook.github.io/react-360/) + +## 总结 + +如果你认为指南可以改进，请提交包含任何更新的 PR 并提交任何问题。此外，我将继续改进这个仓库，因此你可以 star 这个仓库以便于重新访问。 + +## 贡献 + +该指南是使用[Draw.io](https://www.draw.io/)构建的。项目文件可以在 `/src` 目录中找到。要修改它, 请打开 draw.io, 点击 **Open Existing Diagram** 并选择项目中的 `xml` 文件。它将为你打开指南，更新它，上传和更新自述文件中的图像并创建一个 PR（导出为 png）。 + +- 改进后提交 PR +- 讨论问题中的想法 +- 传播消息 + +## 版权许可 + +[![License: CC BY-NC-SA 4.0](https://img.shields.io/badge/License-CC%20BY--NC--SA%204.0-lightgrey.svg)](https://creativecommons.org/licenses/by-nc-sa/4.0/) diff --git a/README-ES.md b/README-ES.md index e26ffec..45ec3a0 100644 --- a/README-ES.md +++ b/README-ES.md @@ -1,186 +1,186 @@ -# React Developer Roadmap - -[README in Chinese](README-CN.md) - -[README in English](README.md) - -[README in Japanese](README-JA.md) - -[README in Korean](README-KO.md) - -[README in Portuguese (Brazil)](README-PTBR.md) - -[README in Russian](README-RU.md) - -> Roadmap para convertirse en un desarrollador React en 2019:: - -A continuación puede encontrar un gráfico que muestra las rutas que puede tomar y las bibliotecas que le gustaría aprender para convertirse en un desarrollador React. Hice esta tabla como una sugerencia para todos los que me preguntan: "¿Qué debo aprender a continuación como desarrollador de React?" - -## Descargo -> El propósito de este roadmap es darte una idea sobre el paisaje. Este lo guiará en caso de estár confundido acerca de qué aprender, en lugar de animarlo a elegir lo que es moderno y actual. Debe comprender mejor por qué una herramienta sería más adecuada para algunos casos que la otra y recordar que la moda y la moda no siempre son las más adecuadas para el trabajo - -## Roadmap - -![Roadmap](./roadmap-es.png) - -## Resources - -1. Básico - 1. HTML - * Aprender los conceptos básicos de HTML. -        * Hacer unas pocas páginas como ejercicio. - 2. CSS - * Aprender los conceptos básicos de CSS - * Páginas de estilo del paso anterior. -        * Construir una página con grid y flexbox. - 3. Javascript Básico - * Familiarizarse con la sintaxis. -        * Aprender operaciones básicas en DOM -        * Aprender los mecanismos típicos de JS (Hoisting, Event Bubbling, creación de prototipos) -        * Hacer algunas llamadas AJAX (XHR) -        * Aprender nuevas características (ECMA Script 6+) -        * Además, familiarícese con la biblioteca jQuery -2. Habilidades generales de desarrollo - 1. Aprenda GIT, cree algunos repositorios en GitHub, comparta su código con otras personas - 2. Conozca el protocolo HTTP (S), métodos de solicitud (GET, POST, PUT, PATCH, DELETE, OPTIONS) - 3. No tengas miedo de usar Google, [Power Searching with Google](http://www.powersearchingwithgoogle.com/) - 4. Familiarícese con el terminal, configure su shell (bash, zsh, fish) -    5. Lee algunos libros sobre algoritmos y estructuras de datos -    6. Lee algunos libros sobre patrones de diseño -3. Aprender React [Página oficial](https://reactjs.org/tutorial/tutorial.html) o completa algunos [cursos](https://egghead.io/courses/the-beginner-s-guide-to-react) -4. Familiarízate con las herramientas que utilizarás. - 1. Gestores de paquetes - * [npm](https://www.npmjs.com/) - * [yarn](https://yarnpkg.com/lang/en/) - * [pnpm](https://pnpm.js.org/) - 2. Task Runners - * [npm scripts](https://docs.npmjs.com/misc/scripts) - * [gulp](https://gulpjs.com/) - * [Webpack](https://webpack.js.org/) - * [Rollup](https://rollupjs.org/guide/en) - * [Parcel](https://parceljs.org/) -5. Estilo - 1. Preprocesadores CSS - * [Sass/CSS](https://sass-lang.com/) - * [PostCSS](https://postcss.org/) - * [Less](http://lesscss.org/) - * [Stylus](http://stylus-lang.com/) - 2. Frameworks CSS - * [Bootstrap](https://getbootstrap.com/) - * [Materialize](https://materializecss.com/), [Material UI](https://material-ui.com/), [Material Design Lite](https://getmdl.io/) - * [Bulma](https://bulma.io/) - * [Semantic UI](https://semantic-ui.com/) - 3. Arquitectura CSS - * [BEM](http://getbem.com/) - * [CSS Modules](https://github.com/css-modules/css-modules) - * [Atomic](https://acss.io/) - * [OOCSS](https://github.com/stubbornella/oocss/wiki) - * [SMACSS](https://smacss.com/) - * [SUITCSS](https://suitcss.github.io/) - 4. CSS en JS - * [Styled Components](https://www.styled-components.com/) - * [Radium](https://formidable.com/open-source/radium/) - * [Emotion](https://emotion.sh/) - * [JSS](http://cssinjs.org/) - * [Aphrodite](https://github.com/Khan/aphrodite) -6. Manejo del estado - 1. [Component State](https://reactjs.org/docs/faq-state.html)/[Context API](https://reactjs.org/docs/context.html) - 2. [Redux](https://redux.js.org/) - 1. Acciones asincrónicas (Efectos secundarios) - * [Redux Thunk](https://github.com/reduxjs/redux-thunk) - * [Redux Better Promise](https://github.com/Lukasz-pluszczewski/redux-better-promise) - * [Redux Saga](https://redux-saga.js.org/) - * [Redux Observable](https://redux-observable.js.org) - 2. Helpers - * [Rematch](https://rematch.gitbooks.io/rematch/) - * [Reselect](https://github.com/reduxjs/reselect) - 3. Persistencia de datos - * [Redux Persist](https://github.com/rt2zz/redux-persist) - * [Redux Phoenix](https://github.com/adam-golab/redux-phoenix) - 4. [Redux Form](https://redux-form.com) - 3. [MobX](https://mobx.js.org/) -7. Comprobadores de tipos - * [PropTypes](https://reactjs.org/docs/typechecking-with-proptypes.html) - * [TypeScript](https://www.typescriptlang.org/) - * [Flow](https://flow.org/en/) -8. Helpers de formularios - * [Redux Form](https://redux-form.com) - * [Formik](https://github.com/jaredpalmer/formik) - * [Formsy](https://github.com/formsy/formsy-react) - * [Final Form](https://github.com/final-form/final-form) -9. Enrutamiento - * [React-Router](https://reacttraining.com/react-router/) - * [Router5](https://router5.js.org/) - * [Redux-First Router](https://github.com/faceyspacey/redux-first-router) - * [Reach Router](https://reach.tech/router/) -10. Consumo de API - 1. REST - * [Fetch](https://developer.mozilla.org/en-US/docs/Web/API/Fetch_API) - * [SuperAgent](https://visionmedia.github.io/superagent/) - * [axios](https://github.com/axios/axios) - 2. GraphQL - * [Apollo](https://www.apollographql.com/docs/react/) - * [Relay](https://facebook.github.io/relay/) - * [urql](https://github.com/FormidableLabs/urql) -11. Librerías útiles - * [Lodash](https://lodash.com/) - * [Moment](https://momentjs.com/) - * [classnames](https://github.com/JedWatson/classnames) - * [Numeral](http://numeraljs.com/) - * [RxJS](http://reactivex.io/) - * [ImmutableJS](https://facebook.github.io/immutable-js/) - * [Ramda](https://ramdajs.com/) -12. Pruebas - 1. Pruebas Unitarias - * [Jest](https://facebook.github.io/jest/) - * [Enzyme](http://airbnb.io/enzyme/) - * [Sinon](http://sinonjs.org/) - * [Mocha](https://mochajs.org/) - * [Chai](http://www.chaijs.com/) - * [AVA](https://github.com/avajs/ava) - * [Tape](https://github.com/substack/tape) - 2. Pruebas de extremo a extremo - * [Selenium](https://www.seleniumhq.org/), [Webdriver](http://webdriver.io/) - * [Cypress](https://cypress.io/) - * [Puppeteer](https://pptr.dev/) - * [Cucumber.js](https://github.com/cucumber/cucumber-js) - * [Nightwatch.js](http://nightwatchjs.org/) - 3. Pruebas de integración - * [Karma](https://karma-runner.github.io/) -13. Internacionalización - * [React Intl](https://github.com/yahoo/react-intl) - * [React i18next](https://react.i18next.com/) -14. Render del lado del servidor - * [Next.js](https://nextjs.org/) - * [After.js](https://github.com/jaredpalmer/after.js) - * [Rogue](https://github.com/alidcastano/rogue.js) -15. Generador de sitio estático - * [Gatsby](https://www.gatsbyjs.org/) -16. Integración con Framework de Backend - * [React on Rails](https://shakacode.gitbooks.io/react-on-rails/content/) -17. Móvil - * [React Native](https://facebook.github.io/react-native/) - * [Cordova](https://cordova.apache.org/)/[Phonegap](https://phonegap.com/) -18. Escritorio - * [Proton Native](https://proton-native.js.org/) - * [Electron](https://electronjs.org/) - * [React Native Windows](https://github.com/Microsoft/react-native-windows) -19. Realidad virtual - * [React 360](https://facebook.github.io/react-360/) - -## Conclusión - - -Si cree que se puede mejorar el roadmap, abra un PR con cualquier actualización y envíe cualquier problema. Además, continuaré mejorandolo, por lo que es posible que desee darle una estrella a este repositorio para volver a visitarlo. - -## Contribución - -The roadmap is built using [Draw.io](https://www.draw.io/). Project file can be found at `/src` directory. To modify it, open draw.io, click **Open Existing Diagram** and choose `xml` file with project. It will open the roadmap for you. Update it, upload and update the images in readme and create a PR (export as png). - -- Abrir un pull request con mejoras. -- Discutir ideas en temas (issues). -- Difundir la palabra. - -## Licencia - -[![License: CC BY-NC-SA 4.0](https://img.shields.io/badge/License-CC%20BY--NC--SA%204.0-lightgrey.svg)](https://creativecommons.org/licenses/by-nc-sa/4.0/) +# React Developer Roadmap + +[README in Chinese](README-CN.md) + +[README in English](README.md) + +[README in Japanese](README-JA.md) + +[README in Korean](README-KO.md) + +[README in Portuguese (Brazil)](README-PTBR.md) + +[README in Russian](README-RU.md) + +> Roadmap para convertirse en un desarrollador React en 2019:: + +A continuación puede encontrar un gráfico que muestra las rutas que puede tomar y las bibliotecas que le gustaría aprender para convertirse en un desarrollador React. Hice esta tabla como una sugerencia para todos los que me preguntan: "¿Qué debo aprender a continuación como desarrollador de React?" + +## Descargo +> El propósito de este roadmap es darte una idea sobre el paisaje. Este lo guiará en caso de estár confundido acerca de qué aprender, en lugar de animarlo a elegir lo que es moderno y actual. Debe comprender mejor por qué una herramienta sería más adecuada para algunos casos que la otra y recordar que la moda y la moda no siempre son las más adecuadas para el trabajo + +## Roadmap + +![Roadmap](./roadmap-es.png) + +## Resources + +1. Básico + 1. HTML + * Aprender los conceptos básicos de HTML. +        * Hacer unas pocas páginas como ejercicio. + 2. CSS + * Aprender los conceptos básicos de CSS + * Páginas de estilo del paso anterior. +        * Construir una página con grid y flexbox. + 3. Javascript Básico + * Familiarizarse con la sintaxis. +        * Aprender operaciones básicas en DOM +        * Aprender los mecanismos típicos de JS (Hoisting, Event Bubbling, creación de prototipos) +        * Hacer algunas llamadas AJAX (XHR) +        * Aprender nuevas características (ECMA Script 6+) +        * Además, familiarícese con la biblioteca jQuery +2. Habilidades generales de desarrollo + 1. Aprenda GIT, cree algunos repositorios en GitHub, comparta su código con otras personas + 2. Conozca el protocolo HTTP (S), métodos de solicitud (GET, POST, PUT, PATCH, DELETE, OPTIONS) + 3. No tengas miedo de usar Google, [Power Searching with Google](http://www.powersearchingwithgoogle.com/) + 4. Familiarícese con el terminal, configure su shell (bash, zsh, fish) +    5. Lee algunos libros sobre algoritmos y estructuras de datos +    6. Lee algunos libros sobre patrones de diseño +3. Aprender React [Página oficial](https://reactjs.org/tutorial/tutorial.html) o completa algunos [cursos](https://egghead.io/courses/the-beginner-s-guide-to-react) +4. Familiarízate con las herramientas que utilizarás. + 1. Gestores de paquetes + * [npm](https://www.npmjs.com/) + * [yarn](https://yarnpkg.com/lang/en/) + * [pnpm](https://pnpm.js.org/) + 2. Task Runners + * [npm scripts](https://docs.npmjs.com/misc/scripts) + * [gulp](https://gulpjs.com/) + * [Webpack](https://webpack.js.org/) + * [Rollup](https://rollupjs.org/guide/en) + * [Parcel](https://parceljs.org/) +5. Estilo + 1. Preprocesadores CSS + * [Sass/CSS](https://sass-lang.com/) + * [PostCSS](https://postcss.org/) + * [Less](http://lesscss.org/) + * [Stylus](http://stylus-lang.com/) + 2. Frameworks CSS + * [Bootstrap](https://getbootstrap.com/) + * [Materialize](https://materializecss.com/), [Material UI](https://material-ui.com/), [Material Design Lite](https://getmdl.io/) + * [Bulma](https://bulma.io/) + * [Semantic UI](https://semantic-ui.com/) + 3. Arquitectura CSS + * [BEM](http://getbem.com/) + * [CSS Modules](https://github.com/css-modules/css-modules) + * [Atomic](https://acss.io/) + * [OOCSS](https://github.com/stubbornella/oocss/wiki) + * [SMACSS](https://smacss.com/) + * [SUITCSS](https://suitcss.github.io/) + 4. CSS en JS + * [Styled Components](https://www.styled-components.com/) + * [Radium](https://formidable.com/open-source/radium/) + * [Emotion](https://emotion.sh/) + * [JSS](http://cssinjs.org/) + * [Aphrodite](https://github.com/Khan/aphrodite) +6. Manejo del estado + 1. [Component State](https://reactjs.org/docs/faq-state.html)/[Context API](https://reactjs.org/docs/context.html) + 2. [Redux](https://redux.js.org/) + 1. Acciones asincrónicas (Efectos secundarios) + * [Redux Thunk](https://github.com/reduxjs/redux-thunk) + * [Redux Better Promise](https://github.com/Lukasz-pluszczewski/redux-better-promise) + * [Redux Saga](https://redux-saga.js.org/) + * [Redux Observable](https://redux-observable.js.org) + 2. Helpers + * [Rematch](https://rematch.gitbooks.io/rematch/) + * [Reselect](https://github.com/reduxjs/reselect) + 3. Persistencia de datos + * [Redux Persist](https://github.com/rt2zz/redux-persist) + * [Redux Phoenix](https://github.com/adam-golab/redux-phoenix) + 4. [Redux Form](https://redux-form.com) + 3. [MobX](https://mobx.js.org/) +7. Comprobadores de tipos + * [PropTypes](https://reactjs.org/docs/typechecking-with-proptypes.html) + * [TypeScript](https://www.typescriptlang.org/) + * [Flow](https://flow.org/en/) +8. Helpers de formularios + * [Redux Form](https://redux-form.com) + * [Formik](https://github.com/jaredpalmer/formik) + * [Formsy](https://github.com/formsy/formsy-react) + * [Final Form](https://github.com/final-form/final-form) +9. Enrutamiento + * [React-Router](https://reacttraining.com/react-router/) + * [Router5](https://router5.js.org/) + * [Redux-First Router](https://github.com/faceyspacey/redux-first-router) + * [Reach Router](https://reach.tech/router/) +10. Consumo de API + 1. REST + * [Fetch](https://developer.mozilla.org/en-US/docs/Web/API/Fetch_API) + * [SuperAgent](https://visionmedia.github.io/superagent/) + * [axios](https://github.com/axios/axios) + 2. GraphQL + * [Apollo](https://www.apollographql.com/docs/react/) + * [Relay](https://facebook.github.io/relay/) + * [urql](https://github.com/FormidableLabs/urql) +11. Librerías útiles + * [Lodash](https://lodash.com/) + * [Moment](https://momentjs.com/) + * [classnames](https://github.com/JedWatson/classnames) + * [Numeral](http://numeraljs.com/) + * [RxJS](http://reactivex.io/) + * [ImmutableJS](https://facebook.github.io/immutable-js/) + * [Ramda](https://ramdajs.com/) +12. Pruebas + 1. Pruebas Unitarias + * [Jest](https://facebook.github.io/jest/) + * [Enzyme](http://airbnb.io/enzyme/) + * [Sinon](http://sinonjs.org/) + * [Mocha](https://mochajs.org/) + * [Chai](http://www.chaijs.com/) + * [AVA](https://github.com/avajs/ava) + * [Tape](https://github.com/substack/tape) + 2. Pruebas de extremo a extremo + * [Selenium](https://www.seleniumhq.org/), [Webdriver](http://webdriver.io/) + * [Cypress](https://cypress.io/) + * [Puppeteer](https://pptr.dev/) + * [Cucumber.js](https://github.com/cucumber/cucumber-js) + * [Nightwatch.js](http://nightwatchjs.org/) + 3. Pruebas de integración + * [Karma](https://karma-runner.github.io/) +13. Internacionalización + * [React Intl](https://github.com/yahoo/react-intl) + * [React i18next](https://react.i18next.com/) +14. Render del lado del servidor + * [Next.js](https://nextjs.org/) + * [After.js](https://github.com/jaredpalmer/after.js) + * [Rogue](https://github.com/alidcastano/rogue.js) +15. Generador de sitio estático + * [Gatsby](https://www.gatsbyjs.org/) +16. Integración con Framework de Backend + * [React on Rails](https://shakacode.gitbooks.io/react-on-rails/content/) +17. Móvil + * [React Native](https://facebook.github.io/react-native/) + * [Cordova](https://cordova.apache.org/)/[Phonegap](https://phonegap.com/) +18. Escritorio + * [Proton Native](https://proton-native.js.org/) + * [Electron](https://electronjs.org/) + * [React Native Windows](https://github.com/Microsoft/react-native-windows) +19. Realidad virtual + * [React 360](https://facebook.github.io/react-360/) + +## Conclusión + + +Si cree que se puede mejorar el roadmap, abra un PR con cualquier actualización y envíe cualquier problema. Además, continuaré mejorandolo, por lo que es posible que desee darle una estrella a este repositorio para volver a visitarlo. + +## Contribución + +The roadmap is built using [Draw.io](https://www.draw.io/). Project file can be found at `/src` directory. To modify it, open draw.io, click **Open Existing Diagram** and choose `xml` file with project. It will open the roadmap for you. Update it, upload and update the images in readme and create a PR (export as png). + +- Abrir un pull request con mejoras. +- Discutir ideas en temas (issues). +- Difundir la palabra. + +## Licencia + +[![License: CC BY-NC-SA 4.0](https://img.shields.io/badge/License-CC%20BY--NC--SA%204.0-lightgrey.svg)](https://creativecommons.org/licenses/by-nc-sa/4.0/) diff --git a/README-JA.md b/README-JA.md index c6383ab..69141de 100644 --- a/README-JA.md +++ b/README-JA.md @@ -1,187 +1,187 @@ -# React 開発者ロードマップ - -[README in Chinese](README-CN.md) - -[README in English](README.md) - -[README in Korean](README-KO.md) - -[README in Portuguese (Brazil)](README-PTBR.md) - -[README in Russian](README-RU.md) - -[README in Spanish](README-ES.md) - -> Roadmap to becoming a React developer in 2019: - -これはReact開発者になるためにあなたが学ぶべき技術やライブラリを示すチャートです。 このチャートは、「React開発者として次に何を学ぶ必要があるのか」と悩むすべての人へのヒントとして作成しました。 - -## 免責事項 -> このロードマップの目的は、あなたに状況を把握するヒントを与えることです。 あなたが次に何を学ぶべきかについて迷っているときにこのロードマップが導いてくれるでしょう。 あるツールがどのようなケースで他よりも適しているのか、その理由について理解を深める必要があります。また、流行しているものが必ずしも最適であるとは限らないことに注意してください。 - -## Roadmap - -![Roadmap](./roadmap-ja.png) - -## Resources - -1. 基礎知識 - 1. HTML - * HTMLの基礎知識を学ぶ - * 練習としていくつかページを作成する - 2. CSS - * CSSの基礎知識を学ぶ - * 前項で作成したページにCSSを当てる - * ページを grid 及び flexbox で作成する - 3. JS基礎 - * 構文に詳しくなる - * DOMの基本操作を学ぶ - * JSに特徴的なメカニズムを学ぶ (巻き上げ(Hoisting), Event Bubbling, Prototyping) - * AJAX (XHR) を利用する - * 新機能を学ぶ (ECMA Script 6以降) - * jQueryライブラリに詳しくなる -2. 一般開発技能 - 1. GITについて学ぶ。GitHubにいくつかレポジトリを作成し他の人と共有してみる - 2. Know HTTP(S) protocol, request methods (GET, POST, PUT, PATCH, DELETE, OPTIONS) - 2. HTTP(S)について知る。リクエストメソッド (GET, POST, PUT, PATCH, DELETE, OPTIONS) - 3. Googleを活用して検索する。[Power Searching with Google](http://www.powersearchingwithgoogle.com/) - 4. ターミナルに慣れる。shell(bash, zsh, fish)の設定をしてみる。 - 5. データ構造とアルゴリズムについての本を読む - 6. デザインパターンについての本を読む -3. 公式サイトでReactについて学ぶ [official website](https://reactjs.org/tutorial/tutorial.html) or complete some [courses](https://egghead.io/courses/the-beginner-s-guide-to-react) -4. 利用するツールに詳しくなる - 1. Package Managers - * [npm](https://www.npmjs.com/) - * [yarn](https://yarnpkg.com/lang/en/) - * [pnpm](https://pnpm.js.org/) - 2. Task Runners - * [npm scripts](https://docs.npmjs.com/misc/scripts) - * [gulp](https://gulpjs.com/) - * [Webpack](https://webpack.js.org/) - * [Rollup](https://rollupjs.org/guide/en) - * [Parcel](https://parceljs.org/) -5. Styling - 1. CSS Preprocessor - * [Sass/CSS](https://sass-lang.com/) - * [PostCSS](https://postcss.org/) - * [Less](http://lesscss.org/) - * [Stylus](http://stylus-lang.com/) - 2. CSS Frameworks - * [Bootstrap](https://getbootstrap.com/) - * [Materialize](https://materializecss.com/), [Material UI](https://material-ui.com/), [Material Design Lite](https://getmdl.io/) - * [Bulma](https://bulma.io/) - * [Semantic UI](https://semantic-ui.com/) - 3. CSS Architecture - * [BEM](http://getbem.com/) - * [CSS Modules](https://github.com/css-modules/css-modules) - * [Atomic](https://acss.io/) - * [OOCSS](https://github.com/stubbornella/oocss/wiki) - * [SMACSS](https://smacss.com/) - * [SUITCSS](https://suitcss.github.io/) - 4. CSS in JS - * [Styled Components](https://www.styled-components.com/) - * [Radium](https://formidable.com/open-source/radium/) - * [Emotion](https://emotion.sh/) - * [JSS](http://cssinjs.org/) - * [Aphrodite](https://github.com/Khan/aphrodite) -6. State管理 - 1. [Component State](https://reactjs.org/docs/faq-state.html)/[Context API](https://reactjs.org/docs/context.html) - 2. [Redux](https://redux.js.org/) - 1. 非同期処理 (副作用) - * [Redux Thunk](https://github.com/reduxjs/redux-thunk) - * [Redux Better Promise](https://github.com/Lukasz-pluszczewski/redux-better-promise) - * [Redux Saga](https://redux-saga.js.org/) - * [Redux Observable](https://redux-observable.js.org) - 2. Helpers - * [Rematch](https://rematch.gitbooks.io/rematch/) - * [Reselect](https://github.com/reduxjs/reselect) - 3. Data persistence - * [Redux Persist](https://github.com/rt2zz/redux-persist) - * [Redux Phoenix](https://github.com/adam-golab/redux-phoenix) - 4. [Redux Form](https://redux-form.com) - 3. [MobX](https://mobx.js.org/) -7. 型チェッカー - * [PropTypes](https://reactjs.org/docs/typechecking-with-proptypes.html) - * [TypeScript](https://www.typescriptlang.org/) - * [Flow](https://flow.org/en/) -8. Form Helpers - * [Redux Form](https://redux-form.com) - * [Formik](https://github.com/jaredpalmer/formik) - * [Formsy](https://github.com/formsy/formsy-react) - * [Final Form](https://github.com/final-form/final-form) -9. Routing - * [React-Router](https://reacttraining.com/react-router/) - * [Router5](https://router5.js.org/) - * [Redux-First Router](https://github.com/faceyspacey/redux-first-router) - * [Reach Router](https://reach.tech/router/) -10. API Clients - 1. REST - * [Fetch](https://developer.mozilla.org/en-US/docs/Web/API/Fetch_API) - * [SuperAgent](https://visionmedia.github.io/superagent/) - * [axios](https://github.com/axios/axios) - 2. GraphQL - * [Apollo](https://www.apollographql.com/docs/react/) - * [Relay](https://facebook.github.io/relay/) - * [urql](https://github.com/FormidableLabs/urql) -11. Utility Libraries - * [Lodash](https://lodash.com/) - * [Moment](https://momentjs.com/) - * [classnames](https://github.com/JedWatson/classnames) - * [Numeral](http://numeraljs.com/) - * [RxJS](http://reactivex.io/) - * [ImmutableJS](https://facebook.github.io/immutable-js/) - * [Ramda](https://ramdajs.com/) -12. Testing - 1. Unit Testing - * [Jest](https://facebook.github.io/jest/) - * [Enzyme](http://airbnb.io/enzyme/) - * [Sinon](http://sinonjs.org/) - * [Mocha](https://mochajs.org/) - * [Chai](http://www.chaijs.com/) - * [AVA](https://github.com/avajs/ava) - * [Tape](https://github.com/substack/tape) - 2. End to End Testing - * [Selenium](https://www.seleniumhq.org/), [Webdriver](http://webdriver.io/) - * [Cypress](https://cypress.io/) - * [Puppeteer](https://pptr.dev/) - * [Cucumber.js](https://github.com/cucumber/cucumber-js) - * [Nightwatch.js](http://nightwatchjs.org/) - 3. Integration Testing - * [Karma](https://karma-runner.github.io/) -13. 国際化(Internationalization) - * [React Intl](https://github.com/yahoo/react-intl) - * [React i18next](https://react.i18next.com/) -14. Server Side Rendering - * [Next.js](https://nextjs.org/) - * [After.js](https://github.com/jaredpalmer/after.js) - * [Rogue](https://github.com/alidcastano/rogue.js) -15. 静的サイトジェネレータ(Static Site Generator) - * [Gatsby](https://www.gatsbyjs.org/) -16. Backend Framework Integration - * [React on Rails](https://shakacode.gitbooks.io/react-on-rails/content/) -17. Mobile - * [React Native](https://facebook.github.io/react-native/) - * [Cordova](https://cordova.apache.org/)/[Phonegap](https://phonegap.com/) -18. Desktop - * [Proton Native](https://proton-native.js.org/) - * [Electron](https://electronjs.org/) - * [React Native Windows](https://github.com/Microsoft/react-native-windows) -19. Virtual Reality - * [React 360](https://facebook.github.io/react-360/) - -## Wrap Up - -ロードマップに改善できる点があれば、Pull Requestを開いてissueを投稿してください。私もあなたがSTARをつけたくなるように、このロードマップを改善し続けます。 - -## Contribution - -このロードマップは [Draw.io](https://www.draw.io/) を利用してつくられています。プロジェクトファイルは `/src` ディレクトリにあります。 修正するときは, draw.ioを開いて **Open Existing Diagram** をクリックし `xml` ファイルを選択してください。ロードマップが開きます。それを更新し `png` としてエクスポートして、ファイルとreadmeを更新し, Pull Requestを作成してください. - - -- 改善のプルリクエストを開く -- 問題のアイデアを話し合う -- 広く周知する - -## License - -[![License: CC BY-NC-SA 4.0](https://img.shields.io/badge/License-CC%20BY--NC--SA%204.0-lightgrey.svg)](https://creativecommons.org/licenses/by-nc-sa/4.0/) +# React 開発者ロードマップ + +[README in Chinese](README-CN.md) + +[README in English](README.md) + +[README in Korean](README-KO.md) + +[README in Portuguese (Brazil)](README-PTBR.md) + +[README in Russian](README-RU.md) + +[README in Spanish](README-ES.md) + +> Roadmap to becoming a React developer in 2019: + +これはReact開発者になるためにあなたが学ぶべき技術やライブラリを示すチャートです。 このチャートは、「React開発者として次に何を学ぶ必要があるのか」と悩むすべての人へのヒントとして作成しました。 + +## 免責事項 +> このロードマップの目的は、あなたに状況を把握するヒントを与えることです。 あなたが次に何を学ぶべきかについて迷っているときにこのロードマップが導いてくれるでしょう。 あるツールがどのようなケースで他よりも適しているのか、その理由について理解を深める必要があります。また、流行しているものが必ずしも最適であるとは限らないことに注意してください。 + +## Roadmap + +![Roadmap](./roadmap-ja.png) + +## Resources + +1. 基礎知識 + 1. HTML + * HTMLの基礎知識を学ぶ + * 練習としていくつかページを作成する + 2. CSS + * CSSの基礎知識を学ぶ + * 前項で作成したページにCSSを当てる + * ページを grid 及び flexbox で作成する + 3. JS基礎 + * 構文に詳しくなる + * DOMの基本操作を学ぶ + * JSに特徴的なメカニズムを学ぶ (巻き上げ(Hoisting), Event Bubbling, Prototyping) + * AJAX (XHR) を利用する + * 新機能を学ぶ (ECMA Script 6以降) + * jQueryライブラリに詳しくなる +2. 一般開発技能 + 1. GITについて学ぶ。GitHubにいくつかレポジトリを作成し他の人と共有してみる + 2. Know HTTP(S) protocol, request methods (GET, POST, PUT, PATCH, DELETE, OPTIONS) + 2. HTTP(S)について知る。リクエストメソッド (GET, POST, PUT, PATCH, DELETE, OPTIONS) + 3. Googleを活用して検索する。[Power Searching with Google](http://www.powersearchingwithgoogle.com/) + 4. ターミナルに慣れる。shell(bash, zsh, fish)の設定をしてみる。 + 5. データ構造とアルゴリズムについての本を読む + 6. デザインパターンについての本を読む +3. 公式サイトでReactについて学ぶ [official website](https://reactjs.org/tutorial/tutorial.html) or complete some [courses](https://egghead.io/courses/the-beginner-s-guide-to-react) +4. 利用するツールに詳しくなる + 1. Package Managers + * [npm](https://www.npmjs.com/) + * [yarn](https://yarnpkg.com/lang/en/) + * [pnpm](https://pnpm.js.org/) + 2. Task Runners + * [npm scripts](https://docs.npmjs.com/misc/scripts) + * [gulp](https://gulpjs.com/) + * [Webpack](https://webpack.js.org/) + * [Rollup](https://rollupjs.org/guide/en) + * [Parcel](https://parceljs.org/) +5. Styling + 1. CSS Preprocessor + * [Sass/CSS](https://sass-lang.com/) + * [PostCSS](https://postcss.org/) + * [Less](http://lesscss.org/) + * [Stylus](http://stylus-lang.com/) + 2. CSS Frameworks + * [Bootstrap](https://getbootstrap.com/) + * [Materialize](https://materializecss.com/), [Material UI](https://material-ui.com/), [Material Design Lite](https://getmdl.io/) + * [Bulma](https://bulma.io/) + * [Semantic UI](https://semantic-ui.com/) + 3. CSS Architecture + * [BEM](http://getbem.com/) + * [CSS Modules](https://github.com/css-modules/css-modules) + * [Atomic](https://acss.io/) + * [OOCSS](https://github.com/stubbornella/oocss/wiki) + * [SMACSS](https://smacss.com/) + * [SUITCSS](https://suitcss.github.io/) + 4. CSS in JS + * [Styled Components](https://www.styled-components.com/) + * [Radium](https://formidable.com/open-source/radium/) + * [Emotion](https://emotion.sh/) + * [JSS](http://cssinjs.org/) + * [Aphrodite](https://github.com/Khan/aphrodite) +6. State管理 + 1. [Component State](https://reactjs.org/docs/faq-state.html)/[Context API](https://reactjs.org/docs/context.html) + 2. [Redux](https://redux.js.org/) + 1. 非同期処理 (副作用) + * [Redux Thunk](https://github.com/reduxjs/redux-thunk) + * [Redux Better Promise](https://github.com/Lukasz-pluszczewski/redux-better-promise) + * [Redux Saga](https://redux-saga.js.org/) + * [Redux Observable](https://redux-observable.js.org) + 2. Helpers + * [Rematch](https://rematch.gitbooks.io/rematch/) + * [Reselect](https://github.com/reduxjs/reselect) + 3. Data persistence + * [Redux Persist](https://github.com/rt2zz/redux-persist) + * [Redux Phoenix](https://github.com/adam-golab/redux-phoenix) + 4. [Redux Form](https://redux-form.com) + 3. [MobX](https://mobx.js.org/) +7. 型チェッカー + * [PropTypes](https://reactjs.org/docs/typechecking-with-proptypes.html) + * [TypeScript](https://www.typescriptlang.org/) + * [Flow](https://flow.org/en/) +8. Form Helpers + * [Redux Form](https://redux-form.com) + * [Formik](https://github.com/jaredpalmer/formik) + * [Formsy](https://github.com/formsy/formsy-react) + * [Final Form](https://github.com/final-form/final-form) +9. Routing + * [React-Router](https://reacttraining.com/react-router/) + * [Router5](https://router5.js.org/) + * [Redux-First Router](https://github.com/faceyspacey/redux-first-router) + * [Reach Router](https://reach.tech/router/) +10. API Clients + 1. REST + * [Fetch](https://developer.mozilla.org/en-US/docs/Web/API/Fetch_API) + * [SuperAgent](https://visionmedia.github.io/superagent/) + * [axios](https://github.com/axios/axios) + 2. GraphQL + * [Apollo](https://www.apollographql.com/docs/react/) + * [Relay](https://facebook.github.io/relay/) + * [urql](https://github.com/FormidableLabs/urql) +11. Utility Libraries + * [Lodash](https://lodash.com/) + * [Moment](https://momentjs.com/) + * [classnames](https://github.com/JedWatson/classnames) + * [Numeral](http://numeraljs.com/) + * [RxJS](http://reactivex.io/) + * [ImmutableJS](https://facebook.github.io/immutable-js/) + * [Ramda](https://ramdajs.com/) +12. Testing + 1. Unit Testing + * [Jest](https://facebook.github.io/jest/) + * [Enzyme](http://airbnb.io/enzyme/) + * [Sinon](http://sinonjs.org/) + * [Mocha](https://mochajs.org/) + * [Chai](http://www.chaijs.com/) + * [AVA](https://github.com/avajs/ava) + * [Tape](https://github.com/substack/tape) + 2. End to End Testing + * [Selenium](https://www.seleniumhq.org/), [Webdriver](http://webdriver.io/) + * [Cypress](https://cypress.io/) + * [Puppeteer](https://pptr.dev/) + * [Cucumber.js](https://github.com/cucumber/cucumber-js) + * [Nightwatch.js](http://nightwatchjs.org/) + 3. Integration Testing + * [Karma](https://karma-runner.github.io/) +13. 国際化(Internationalization) + * [React Intl](https://github.com/yahoo/react-intl) + * [React i18next](https://react.i18next.com/) +14. Server Side Rendering + * [Next.js](https://nextjs.org/) + * [After.js](https://github.com/jaredpalmer/after.js) + * [Rogue](https://github.com/alidcastano/rogue.js) +15. 静的サイトジェネレータ(Static Site Generator) + * [Gatsby](https://www.gatsbyjs.org/) +16. Backend Framework Integration + * [React on Rails](https://shakacode.gitbooks.io/react-on-rails/content/) +17. Mobile + * [React Native](https://facebook.github.io/react-native/) + * [Cordova](https://cordova.apache.org/)/[Phonegap](https://phonegap.com/) +18. Desktop + * [Proton Native](https://proton-native.js.org/) + * [Electron](https://electronjs.org/) + * [React Native Windows](https://github.com/Microsoft/react-native-windows) +19. Virtual Reality + * [React 360](https://facebook.github.io/react-360/) + +## Wrap Up + +ロードマップに改善できる点があれば、Pull Requestを開いてissueを投稿してください。私もあなたがSTARをつけたくなるように、このロードマップを改善し続けます。 + +## Contribution + +このロードマップは [Draw.io](https://www.draw.io/) を利用してつくられています。プロジェクトファイルは `/src` ディレクトリにあります。 修正するときは, draw.ioを開いて **Open Existing Diagram** をクリックし `xml` ファイルを選択してください。ロードマップが開きます。それを更新し `png` としてエクスポートして、ファイルとreadmeを更新し, Pull Requestを作成してください. + + +- 改善のプルリクエストを開く +- 問題のアイデアを話し合う +- 広く周知する + +## License + +[![License: CC BY-NC-SA 4.0](https://img.shields.io/badge/License-CC%20BY--NC--SA%204.0-lightgrey.svg)](https://creativecommons.org/licenses/by-nc-sa/4.0/) diff --git a/README-KO.md b/README-KO.md index 84f3626..69cf11a 100644 --- a/README-KO.md +++ b/README-KO.md @@ -1,186 +1,186 @@ -# React 개발자 로드맵 - -[README in Chinese](README-CN.md) - -[README in English](README.md) - -[README in Japanese](README-JA.md) - -[README in Portuguese (Brazil)](README-PTBR.md) - -[README in Russian](README-RU.md) - -[README in Spanish](README-ES.md) - -> 2019년 React 개발자 로드맵: - -아래에는 React 개발자가 되기 위한 학습 로드맵과 관련 라이브러리들이 적혀있는 차트가 있습니다. React 개발자로서 다음에 무엇을 배워야하는지 묻는 모든 사람들을 위한 팁으로 이 차트를 만들었습니다. - -## 주의사항 - -> 이 로드맵의 목적은 전체에 대한 윤곽을 제공하는 것입니다. 여러분이 무조건 힙하고 트렌디한 것을 선택하기보단, 앞으로 무엇을 배워야할지 혼란스러울때 이 로드맵이 좋은 가이드가 될 것입니다. 기술을 선택함에 있어 하나의 도구가 다른 도구보다 어떤 경우에 적합한지 이해해야하며, 힙하고 트렌디한 기술들이 항상 모든 업무에 적합하진 않다는 것을 염두에 두시기 바랍니다. - -## 로드맵 - -![Roadmap](./roadmap-ko.png) - -## 학습 리소스 - -1. 기본기 - 1. HTML - - HTML의 기본기를 다져주세요. - - 연습삼아 몇 개의 페이지를 만들어보세요. - 2. CSS - - CSS의 기본기를 다져주세요. - - 이전 단계에서 만들었던 페이지들을 꾸며보세요. - - Grid와 flexbox를 활용해 페이지를 만들어보세요. - 3. JS 기본 - - 문법에 익숙해지세요. - - DOM을 활용한 기본적인 작업들을 배우세요. - - JS에 대한 일반적인 메커니즘을 배우세요. (호이스팅, 이벤트 버블링, 프로토타입) - - AJAX (XHR) 요청을 해보세요. - - 새로운 기능을 배우세요. (ECMA Script 6+) - - 선택적으로, jQuery 라이브러리에 익숙해지면 좋습니다. -2. 기본적인 개발 스킬 - 1. GIT에 대해 공부하고, GitHub에 몇 개의 Repository를 만들어도 보고, 다른 사람들에게 여러분의 코드를 공유해보세요. - 2. Request 메소드 (GET, POST, PUT, PATCH, DELETE, OPTIONS)와 더불어 HTTP(S) 프로토콜에 대해 공부하세요. - 3. 구글링을 겁내지 마세요. [구글로 파워서칭 해보기](http://www.powersearchingwithgoogle.com/) - 4. 터미널에 익숙해지시고, 여러분만의 shell (bash, zsh, fish)을 설정해보세요. - 5. 알고리즘과 자료구조에 대한 몇 개의 책을 읽어보세요. - 6. 디자인 패턴에 대한 몇 개의 책을 읽어보세요. -3. [공식 홈페이지](https://reactjs.org/tutorial/tutorial.html)에서 튜토리얼을 읽어보거나 몇 개의 [코스들](https://egghead.io/courses/the-beginner-s-guide-to-react)을 수강해보세요. -4. 여러분이 사용할 도구들에 익숙해지세요. - 1. 패키지 관리 - - [npm](https://www.npmjs.com/) - - [yarn](https://yarnpkg.com/lang/en/) - - [pnpm](https://pnpm.js.org/) - 2. 태스크 러너 - - [npm scripts](https://docs.npmjs.com/misc/scripts) - - [gulp](https://gulpjs.com/) - - [Webpack](https://webpack.js.org/) - - [Rollup](https://rollupjs.org/guide/en) - - [Parcel](https://parceljs.org/) -5. 스타일링 - 1. CSS 전처리기 - - [Sass/CSS](https://sass-lang.com/) - - [PostCSS](https://postcss.org/) - - [Less](http://lesscss.org/) - - [Stylus](http://stylus-lang.com/) - 2. CSS 프레임워크 - - [Bootstrap](https://getbootstrap.com/) - - [Materialize](https://materializecss.com/), [Material UI](https://material-ui.com/), [Material Design Lite](https://getmdl.io/) - - [Bulma](https://bulma.io/) - - [Semantic UI](https://semantic-ui.com/) - 3. CSS 설계 - - [BEM](http://getbem.com/) - - [CSS Modules](https://github.com/css-modules/css-modules) - - [Atomic](https://acss.io/) - - [OOCSS](https://github.com/stubbornella/oocss/wiki) - - [SMACSS](https://smacss.com/) - - [SUITCSS](https://suitcss.github.io/) - 4. CSS in JS - - [Styled Components](https://www.styled-components.com/) - - [Radium](https://formidable.com/open-source/radium/) - - [Emotion](https://emotion.sh/) - - [JSS](http://cssinjs.org/) - - [Aphrodite](https://github.com/Khan/aphrodite) -6. 상태관리 - 1. [컴포넌트 상태관리](https://reactjs.org/docs/faq-state.html)/[Context API](https://reactjs.org/docs/context.html) - 2. [Redux](https://redux.js.org/) - 1. 비동기 액션 (사이드 이펙트) - - [Redux Thunk](https://github.com/reduxjs/redux-thunk) - - [Redux Better Promise](https://github.com/Lukasz-pluszczewski/redux-better-promise) - - [Redux Saga](https://redux-saga.js.org/) - - [Redux Observable](https://redux-observable.js.org) - 2. 헬퍼 라이브러리 - - [Rematch](https://rematch.gitbooks.io/rematch/) - - [Reselect](https://github.com/reduxjs/reselect) - 3. 데이터 지속성 - - [Redux Persist](https://github.com/rt2zz/redux-persist) - - [Redux Phoenix](https://github.com/adam-golab/redux-phoenix) - 4. [Redux Form](https://redux-form.com) - 3. [MobX](https://mobx.js.org/) -7. 정적 타입 체킹 - - [PropTypes](https://reactjs.org/docs/typechecking-with-proptypes.html) - - [TypeScript](https://www.typescriptlang.org/) - - [Flow](https://flow.org/en/) -8. 폼(Form) 헬퍼 - - [Redux Form](https://redux-form.com) - - [Formik](https://github.com/jaredpalmer/formik) - - [Formsy](https://github.com/formsy/formsy-react) - - [Final Form](https://github.com/final-form/final-form) -9. 라우팅 - - [React-Router](https://reacttraining.com/react-router/) - - [Router5](https://router5.js.org/) - - [Redux-First Router](https://github.com/faceyspacey/redux-first-router) - - [Reach Router](https://reach.tech/router/) -10. API 클라이언트 - 1. REST - - [Fetch](https://developer.mozilla.org/en-US/docs/Web/API/Fetch_API) - - [SuperAgent](https://visionmedia.github.io/superagent/) - - [axios](https://github.com/axios/axios) - 2. GraphQL - - [Apollo](https://www.apollographql.com/docs/react/) - - [Relay](https://facebook.github.io/relay/) - - [urql](https://github.com/FormidableLabs/urql) -11. 유틸리티 라이브러리 - - [Lodash](https://lodash.com/) - - [Moment](https://momentjs.com/) - - [classnames](https://github.com/JedWatson/classnames) - - [Numeral](http://numeraljs.com/) - - [RxJS](http://reactivex.io/) - - [ImmutableJS](https://facebook.github.io/immutable-js/) - - [Ramda](https://ramdajs.com/) -12. 테스팅 - 1. 유닛 테스팅 - - [Jest](https://facebook.github.io/jest/) - - [Enzyme](http://airbnb.io/enzyme/) - - [Sinon](http://sinonjs.org/) - - [Mocha](https://mochajs.org/) - - [Chai](http://www.chaijs.com/) - - [AVA](https://github.com/avajs/ava) - - [Tape](https://github.com/substack/tape) - 2. End to End 테스팅 - - [Selenium](https://www.seleniumhq.org/), [Webdriver](http://webdriver.io/) - - [Cypress](https://cypress.io/) - - [Puppeteer](https://pptr.dev/) - - [Cucumber.js](https://github.com/cucumber/cucumber-js) - - [Nightwatch.js](http://nightwatchjs.org/) - 3. 통합 테스팅 - - [Karma](https://karma-runner.github.io/) -13. 국제화 - - [React Intl](https://github.com/yahoo/react-intl) - - [React i18next](https://react.i18next.com/) -14. 서버사이드 렌더링 - - [Next.js](https://nextjs.org/) - - [After.js](https://github.com/jaredpalmer/after.js) - - [Rogue](https://github.com/alidcastano/rogue.js) -15. 정적 사이트 생성기 - - [Gatsby](https://www.gatsbyjs.org/) -16. 백엔드 프레임워크 통합 - - [React on Rails](https://shakacode.gitbooks.io/react-on-rails/content/) -17. 모바일 - - [React Native](https://facebook.github.io/react-native/) - - [Cordova](https://cordova.apache.org/)/[Phonegap](https://phonegap.com/) -18. 데스크탑 - - [Proton Native](https://proton-native.js.org/) - - [Electron](https://electronjs.org/) - - [React Native Windows](https://github.com/Microsoft/react-native-windows) -19. 가상현실 (VR) - - [React 360](https://facebook.github.io/react-360/) - -## 마무리 - -이 로드맵에 개선이 필요하면 수정사항을 포함한 PR을 보내주시거나 이슈에 의견을 남겨주세요. 저 또한 이것을 계속 개선하려고 노력 중에 있으니, 여러분께서도 다시 찾아오시기 쉽도록 Star을 부탁드립니다. - -## 컨트리뷰션 - -이 로드맵은 [Draw.io](https://www.draw.io/)를 사용하여 작성되었습니다. 프로젝트 파일들은 `/src` 디렉토리에 있습니다. 수정하기 위해선 draw.io를 열어서, **Open Existing Diagram** 를 누르시고 프로젝트 내의 `xml` 파일을 선택해주세요. 로드맵 파일이 열릴 것입니다. 수정하시고, readme의 image 파일을 변경해주시고 PR을 만들어주세요. (png 파일로 내보내기 해주세요). - -- 수정 / 개선사항과 함께 Pull Request를 남겨주세요. -- Issues에서 의견을 나눠주세요. -- 다른 사람들에게도 알려주세요. - -## 라이센스 - -[![License: CC BY-NC-SA 4.0](https://img.shields.io/badge/License-CC%20BY--NC--SA%204.0-lightgrey.svg)](https://creativecommons.org/licenses/by-nc-sa/4.0/) +# React 개발자 로드맵 + +[README in Chinese](README-CN.md) + +[README in English](README.md) + +[README in Japanese](README-JA.md) + +[README in Portuguese (Brazil)](README-PTBR.md) + +[README in Russian](README-RU.md) + +[README in Spanish](README-ES.md) + +> 2019년 React 개발자 로드맵: + +아래에는 React 개발자가 되기 위한 학습 로드맵과 관련 라이브러리들이 적혀있는 차트가 있습니다. React 개발자로서 다음에 무엇을 배워야하는지 묻는 모든 사람들을 위한 팁으로 이 차트를 만들었습니다. + +## 주의사항 + +> 이 로드맵의 목적은 전체에 대한 윤곽을 제공하는 것입니다. 여러분이 무조건 힙하고 트렌디한 것을 선택하기보단, 앞으로 무엇을 배워야할지 혼란스러울때 이 로드맵이 좋은 가이드가 될 것입니다. 기술을 선택함에 있어 하나의 도구가 다른 도구보다 어떤 경우에 적합한지 이해해야하며, 힙하고 트렌디한 기술들이 항상 모든 업무에 적합하진 않다는 것을 염두에 두시기 바랍니다. + +## 로드맵 + +![Roadmap](./roadmap-ko.png) + +## 학습 리소스 + +1. 기본기 + 1. HTML + - HTML의 기본기를 다져주세요. + - 연습삼아 몇 개의 페이지를 만들어보세요. + 2. CSS + - CSS의 기본기를 다져주세요. + - 이전 단계에서 만들었던 페이지들을 꾸며보세요. + - Grid와 flexbox를 활용해 페이지를 만들어보세요. + 3. JS 기본 + - 문법에 익숙해지세요. + - DOM을 활용한 기본적인 작업들을 배우세요. + - JS에 대한 일반적인 메커니즘을 배우세요. (호이스팅, 이벤트 버블링, 프로토타입) + - AJAX (XHR) 요청을 해보세요. + - 새로운 기능을 배우세요. (ECMA Script 6+) + - 선택적으로, jQuery 라이브러리에 익숙해지면 좋습니다. +2. 기본적인 개발 스킬 + 1. GIT에 대해 공부하고, GitHub에 몇 개의 Repository를 만들어도 보고, 다른 사람들에게 여러분의 코드를 공유해보세요. + 2. Request 메소드 (GET, POST, PUT, PATCH, DELETE, OPTIONS)와 더불어 HTTP(S) 프로토콜에 대해 공부하세요. + 3. 구글링을 겁내지 마세요. [구글로 파워서칭 해보기](http://www.powersearchingwithgoogle.com/) + 4. 터미널에 익숙해지시고, 여러분만의 shell (bash, zsh, fish)을 설정해보세요. + 5. 알고리즘과 자료구조에 대한 몇 개의 책을 읽어보세요. + 6. 디자인 패턴에 대한 몇 개의 책을 읽어보세요. +3. [공식 홈페이지](https://reactjs.org/tutorial/tutorial.html)에서 튜토리얼을 읽어보거나 몇 개의 [코스들](https://egghead.io/courses/the-beginner-s-guide-to-react)을 수강해보세요. +4. 여러분이 사용할 도구들에 익숙해지세요. + 1. 패키지 관리 + - [npm](https://www.npmjs.com/) + - [yarn](https://yarnpkg.com/lang/en/) + - [pnpm](https://pnpm.js.org/) + 2. 태스크 러너 + - [npm scripts](https://docs.npmjs.com/misc/scripts) + - [gulp](https://gulpjs.com/) + - [Webpack](https://webpack.js.org/) + - [Rollup](https://rollupjs.org/guide/en) + - [Parcel](https://parceljs.org/) +5. 스타일링 + 1. CSS 전처리기 + - [Sass/CSS](https://sass-lang.com/) + - [PostCSS](https://postcss.org/) + - [Less](http://lesscss.org/) + - [Stylus](http://stylus-lang.com/) + 2. CSS 프레임워크 + - [Bootstrap](https://getbootstrap.com/) + - [Materialize](https://materializecss.com/), [Material UI](https://material-ui.com/), [Material Design Lite](https://getmdl.io/) + - [Bulma](https://bulma.io/) + - [Semantic UI](https://semantic-ui.com/) + 3. CSS 설계 + - [BEM](http://getbem.com/) + - [CSS Modules](https://github.com/css-modules/css-modules) + - [Atomic](https://acss.io/) + - [OOCSS](https://github.com/stubbornella/oocss/wiki) + - [SMACSS](https://smacss.com/) + - [SUITCSS](https://suitcss.github.io/) + 4. CSS in JS + - [Styled Components](https://www.styled-components.com/) + - [Radium](https://formidable.com/open-source/radium/) + - [Emotion](https://emotion.sh/) + - [JSS](http://cssinjs.org/) + - [Aphrodite](https://github.com/Khan/aphrodite) +6. 상태관리 + 1. [컴포넌트 상태관리](https://reactjs.org/docs/faq-state.html)/[Context API](https://reactjs.org/docs/context.html) + 2. [Redux](https://redux.js.org/) + 1. 비동기 액션 (사이드 이펙트) + - [Redux Thunk](https://github.com/reduxjs/redux-thunk) + - [Redux Better Promise](https://github.com/Lukasz-pluszczewski/redux-better-promise) + - [Redux Saga](https://redux-saga.js.org/) + - [Redux Observable](https://redux-observable.js.org) + 2. 헬퍼 라이브러리 + - [Rematch](https://rematch.gitbooks.io/rematch/) + - [Reselect](https://github.com/reduxjs/reselect) + 3. 데이터 지속성 + - [Redux Persist](https://github.com/rt2zz/redux-persist) + - [Redux Phoenix](https://github.com/adam-golab/redux-phoenix) + 4. [Redux Form](https://redux-form.com) + 3. [MobX](https://mobx.js.org/) +7. 정적 타입 체킹 + - [PropTypes](https://reactjs.org/docs/typechecking-with-proptypes.html) + - [TypeScript](https://www.typescriptlang.org/) + - [Flow](https://flow.org/en/) +8. 폼(Form) 헬퍼 + - [Redux Form](https://redux-form.com) + - [Formik](https://github.com/jaredpalmer/formik) + - [Formsy](https://github.com/formsy/formsy-react) + - [Final Form](https://github.com/final-form/final-form) +9. 라우팅 + - [React-Router](https://reacttraining.com/react-router/) + - [Router5](https://router5.js.org/) + - [Redux-First Router](https://github.com/faceyspacey/redux-first-router) + - [Reach Router](https://reach.tech/router/) +10. API 클라이언트 + 1. REST + - [Fetch](https://developer.mozilla.org/en-US/docs/Web/API/Fetch_API) + - [SuperAgent](https://visionmedia.github.io/superagent/) + - [axios](https://github.com/axios/axios) + 2. GraphQL + - [Apollo](https://www.apollographql.com/docs/react/) + - [Relay](https://facebook.github.io/relay/) + - [urql](https://github.com/FormidableLabs/urql) +11. 유틸리티 라이브러리 + - [Lodash](https://lodash.com/) + - [Moment](https://momentjs.com/) + - [classnames](https://github.com/JedWatson/classnames) + - [Numeral](http://numeraljs.com/) + - [RxJS](http://reactivex.io/) + - [ImmutableJS](https://facebook.github.io/immutable-js/) + - [Ramda](https://ramdajs.com/) +12. 테스팅 + 1. 유닛 테스팅 + - [Jest](https://facebook.github.io/jest/) + - [Enzyme](http://airbnb.io/enzyme/) + - [Sinon](http://sinonjs.org/) + - [Mocha](https://mochajs.org/) + - [Chai](http://www.chaijs.com/) + - [AVA](https://github.com/avajs/ava) + - [Tape](https://github.com/substack/tape) + 2. End to End 테스팅 + - [Selenium](https://www.seleniumhq.org/), [Webdriver](http://webdriver.io/) + - [Cypress](https://cypress.io/) + - [Puppeteer](https://pptr.dev/) + - [Cucumber.js](https://github.com/cucumber/cucumber-js) + - [Nightwatch.js](http://nightwatchjs.org/) + 3. 통합 테스팅 + - [Karma](https://karma-runner.github.io/) +13. 국제화 + - [React Intl](https://github.com/yahoo/react-intl) + - [React i18next](https://react.i18next.com/) +14. 서버사이드 렌더링 + - [Next.js](https://nextjs.org/) + - [After.js](https://github.com/jaredpalmer/after.js) + - [Rogue](https://github.com/alidcastano/rogue.js) +15. 정적 사이트 생성기 + - [Gatsby](https://www.gatsbyjs.org/) +16. 백엔드 프레임워크 통합 + - [React on Rails](https://shakacode.gitbooks.io/react-on-rails/content/) +17. 모바일 + - [React Native](https://facebook.github.io/react-native/) + - [Cordova](https://cordova.apache.org/)/[Phonegap](https://phonegap.com/) +18. 데스크탑 + - [Proton Native](https://proton-native.js.org/) + - [Electron](https://electronjs.org/) + - [React Native Windows](https://github.com/Microsoft/react-native-windows) +19. 가상현실 (VR) + - [React 360](https://facebook.github.io/react-360/) + +## 마무리 + +이 로드맵에 개선이 필요하면 수정사항을 포함한 PR을 보내주시거나 이슈에 의견을 남겨주세요. 저 또한 이것을 계속 개선하려고 노력 중에 있으니, 여러분께서도 다시 찾아오시기 쉽도록 Star을 부탁드립니다. + +## 컨트리뷰션 + +이 로드맵은 [Draw.io](https://www.draw.io/)를 사용하여 작성되었습니다. 프로젝트 파일들은 `/src` 디렉토리에 있습니다. 수정하기 위해선 draw.io를 열어서, **Open Existing Diagram** 를 누르시고 프로젝트 내의 `xml` 파일을 선택해주세요. 로드맵 파일이 열릴 것입니다. 수정하시고, readme의 image 파일을 변경해주시고 PR을 만들어주세요. (png 파일로 내보내기 해주세요). + +- 수정 / 개선사항과 함께 Pull Request를 남겨주세요. +- Issues에서 의견을 나눠주세요. +- 다른 사람들에게도 알려주세요. + +## 라이센스 + +[![License: CC BY-NC-SA 4.0](https://img.shields.io/badge/License-CC%20BY--NC--SA%204.0-lightgrey.svg)](https://creativecommons.org/licenses/by-nc-sa/4.0/) diff --git a/README-PTBR.md b/README-PTBR.md index bbe45c5..947e98a 100644 --- a/README-PTBR.md +++ b/README-PTBR.md @@ -1,185 +1,185 @@ -# Guia do desenvolvedor React - -[README in Chinese](README-CN.md) - -[README in English](README.md) - -[README in Japanese](README-JA.md) - -[README in Korean](README-KO.md) - -[README in Russian](README-RU.md) - -[README in Spanish](README-ES.md) - -> Guia para se tornar um desenvolvedor React em 2019: -> Abaixo, você pode encontrar um diagrama mostrando os caminhos que podem levar, bem como as bibliotecas que você precisa aprender para se tornar um desenvolvedor React. Eu fiz esse esquema como uma dica para qualquer um que me perguntasse: "O que eu deveria aprender mais como desenvolvedor React?" - -## Aviso - -> O objetivo deste guia é dar uma ideia geral de como se tornar um desenvolvedor React. Este guia irá ajudá-lo se você estiver confuso sobre o que estudar, em vez de encorajá-lo a escolher algo elegante e popular. Você deve entender gradualmente por que uma ferramenta é mais adequada para determinadas situações do que outra, e não se esqueça de que uma ferramenta moderna e popular nem sempre significa que ela é mais adequada para o trabalho. - -## Roadmap - -![Roadmap](./roadmap-ptbr.png) - -## Recursos - -1. Basico - 1. HTML - - Aprenda o básico do HTML - - Desenvolva algumas paginas como exercícios - 2. CSS - - Aprenda o básico de CSS - - Aplique estilos nas páginas desenvolvidas anteriormente - - Desenvolva uma página com CSS Grid e CSS Flexbox - 3. Javascript - - Se familiarize com a sintaxe - - Aprenda operações basicas com o DOM - - Aprenda mecanismos típicos para JS (Hoisting, Event Bubbling, Prototyping) - - Faça algumas requisições AJAX - - Aprenda as novas features do javascript (ECMA Script 6+) - - Opcional: Conheça a biblioteca JQuery -2. Conhecimentos de desenvolvimento em geral - 1. Aprenda GIT, crie repositórios no GitHub e compartilhe seu código com outras pessoas. - 2. Aprenda os protocolos HTTP(S) e metodos de request (GET, POST, PUT, PATCH, DELETE, OPTIONS) - 3. Não tenha medo de utilizar o google, veja [o uso avançado do Google](http://www.powersearchingwithgoogle.com/) - 4. Familiarize-se com terminal e configure-o (bash, zsh, fish) - 5. Leia alguns livros sobre algoritmos e estrutura de dados - 6. Leia alguns livros sobre padrões de projeto (design patterns) -3. Aprenda React no [site oficial](https://reactjs.org/tutorial/tutorial.html) ou realize alguns [cursos](https://egghead.io/courses/the-beginner-s-guide-to-react) -4. Conheça as ferramentas que voce usará - 1. Gerenciadores de pacote - - [npm](https://www.npmjs.com/) - - [yarn](https://yarnpkg.com/lang/en/) - - [pnpm](https://pnpm.js.org/) - 2. Executadores de tarefas - - [npm scripts](https://docs.npmjs.com/misc/scripts) - - [gulp](https://gulpjs.com/) - - [Webpack](https://webpack.js.org/) - - [Rollup](https://rollupjs.org/guide/en) - - [Parcel](https://parceljs.org/) -5. Estilização - 1. Pré-processadores CSS - - [Sass/CSS](https://sass-lang.com/) - - [PostCSS](https://postcss.org/) - - [Less](http://lesscss.org/) - - [Stylus](http://stylus-lang.com/) - 2. Frameworks CSS - - [Bootstrap](https://getbootstrap.com/) - - [Materialize](https://materializecss.com/), [Material UI](https://material-ui.com/), [Material Design Lite](https://getmdl.io/) - - [Bulma](https://bulma.io/) - - [Semantic UI](https://semantic-ui.com/) - 3. Arquitetura CSS - - [BEM](http://getbem.com/) - - [CSS Modules](https://github.com/css-modules/css-modules) - - [Atomic](https://acss.io/) - - [OOCSS](https://github.com/stubbornella/oocss/wiki) - - [SMACSS](https://smacss.com/) - - [SUITCSS](https://suitcss.github.io/) - 4. CSS in JS - - [Styled Components](https://www.styled-components.com/) - - [Radium](https://formidable.com/open-source/radium/) - - [Emotion](https://emotion.sh/) - - [JSS](http://cssinjs.org/) - - [Aphrodite](https://github.com/Khan/aphrodite) -6. Gerenciamento de estado - 1. [Component State](https://reactjs.org/docs/faq-state.html)/[Context API](https://reactjs.org/docs/context.html) - 2. [Redux](https://redux.js.org/) - 1. Async actions (Side Effects) - - [Redux Thunk](https://github.com/reduxjs/redux-thunk) - - [Redux Better Promise](https://github.com/Lukasz-pluszczewski/redux-better-promise) - - [Redux Saga](https://redux-saga.js.org/) - - [Redux Observable](https://redux-observable.js.org) - 2. Helpers - - [Rematch](https://rematch.gitbooks.io/rematch/) - - [Reselect](https://github.com/reduxjs/reselect) - 3. Persistencia de dados - - [Redux Persist](https://github.com/rt2zz/redux-persist) - - [Redux Phoenix](https://github.com/adam-golab/redux-phoenix) - 4. [Redux Form](https://redux-form.com) - 3. [MobX](https://mobx.js.org/) -7. Tipagem - - [PropTypes](https://reactjs.org/docs/typechecking-with-proptypes.html) - - [TypeScript](https://www.typescriptlang.org/) - - [Flow](https://flow.org/en/) -8. Form Helpers - - [Redux Form](https://redux-form.com) - - [Formik](https://github.com/jaredpalmer/formik) - - [Formsy](https://github.com/formsy/formsy-react) - - [Final Form](https://github.com/final-form/final-form) -9. Rotas - - [React-Router](https://reacttraining.com/react-router/) - - [Router5](https://router5.js.org/) - - [Redux-First Router](https://github.com/faceyspacey/redux-first-router) - - [Reach Router](https://reach.tech/router/) -10. Clientes API - 1. REST - - [Fetch](https://developer.mozilla.org/en-US/docs/Web/API/Fetch_API) - - [SuperAgent](https://visionmedia.github.io/superagent/) - - [axios](https://github.com/axios/axios) - 2. GraphQL - - [Apollo](https://www.apollographql.com/docs/react/) - - [Relay](https://facebook.github.io/relay/) - - [urql](https://github.com/FormidableLabs/urql) -11. Bibliotecas uteis - - [Lodash](https://lodash.com/) - - [Moment](https://momentjs.com/) - - [classnames](https://github.com/JedWatson/classnames) - - [Numeral](http://numeraljs.com/) - - [RxJS](http://reactivex.io/) - - [ImmutableJS](https://facebook.github.io/immutable-js/) - - [Ramda](https://ramdajs.com/) -12. Testes - 1. Teste unitário - - [Jest](https://facebook.github.io/jest/) - - [Enzyme](http://airbnb.io/enzyme/) - - [Sinon](http://sinonjs.org/) - - [Mocha](https://mochajs.org/) - - [Chai](http://www.chaijs.com/) - - [AVA](https://github.com/avajs/ava) - - [Tape](https://github.com/substack/tape) - 2. Teste end-to-end - - [Selenium](https://www.seleniumhq.org/), [Webdriver](http://webdriver.io/) - - [Cypress](https://cypress.io/) - - [Puppeteer](https://pptr.dev/) - - [Cucumber.js](https://github.com/cucumber/cucumber-js) - - [Nightwatch.js](http://nightwatchjs.org/) - 3. Teste de integração - - [Karma](https://karma-runner.github.io/) -13. Internacionalização - - [React Intl](https://github.com/yahoo/react-intl) - - [React i18next](https://react.i18next.com/) -14. Renderização no servidor - - [Next.js](https://nextjs.org/) - - [After.js](https://github.com/jaredpalmer/after.js) - - [Rogue](https://github.com/alidcastano/rogue.js) -15. Gerador de site estático - - [Gatsby](https://www.gatsbyjs.org/) -16. Integração com estrturas de backend - - [React on Rails](https://shakacode.gitbooks.io/react-on-rails/content/) -17. Desenvolvimento de aplicativos móveis - - [React Native](https://facebook.github.io/react-native/) - - [Cordova](https://cordova.apache.org/)/[Phonegap](https://phonegap.com/) -18. Desenvolvimento de aplicativos desktop - - [Proton Native](https://proton-native.js.org/) - - [Electron](https://electronjs.org/) - - [React Native Windows](https://github.com/Microsoft/react-native-windows) -19. Realidade virtual - - [React 360](https://facebook.github.io/react-360/) - -## Resumo - -Se você acha que o guia pode ser melhorado, envie um PR com quaisquer atualizações e envie suas dúvidas. Além disso, continuarei a melhorar este repositório, então, favorite esse repositório para sempre revisitar. - -## Contribuição - -O guia foi criado com a ferramenta online [Draw.io](https://www.draw.io/). O arquivo do projeto pode ser encontrado no diretório `/src`. Para alterá-lo, abra o draw.io, clique em **Open Existing Diagram** e selecione o arquivo `xml`. Ele irá abrir o guia. Atualize o guia, faça update das imagens no readme (exporte como png) e crie um PR. - -- Abra pull request com melhorias -- Discuta novas ideias nas issues -- Compartilhe esse repositorio - -## Licença - -[![License: CC BY-NC-SA 4.0](https://img.shields.io/badge/License-CC%20BY--NC--SA%204.0-lightgrey.svg)](https://creativecommons.org/licenses/by-nc-sa/4.0/) +# Guia do desenvolvedor React + +[README in Chinese](README-CN.md) + +[README in English](README.md) + +[README in Japanese](README-JA.md) + +[README in Korean](README-KO.md) + +[README in Russian](README-RU.md) + +[README in Spanish](README-ES.md) + +> Guia para se tornar um desenvolvedor React em 2019: +> Abaixo, você pode encontrar um diagrama mostrando os caminhos que podem levar, bem como as bibliotecas que você precisa aprender para se tornar um desenvolvedor React. Eu fiz esse esquema como uma dica para qualquer um que me perguntasse: "O que eu deveria aprender mais como desenvolvedor React?" + +## Aviso + +> O objetivo deste guia é dar uma ideia geral de como se tornar um desenvolvedor React. Este guia irá ajudá-lo se você estiver confuso sobre o que estudar, em vez de encorajá-lo a escolher algo elegante e popular. Você deve entender gradualmente por que uma ferramenta é mais adequada para determinadas situações do que outra, e não se esqueça de que uma ferramenta moderna e popular nem sempre significa que ela é mais adequada para o trabalho. + +## Roadmap + +![Roadmap](./roadmap-ptbr.png) + +## Recursos + +1. Basico + 1. HTML + - Aprenda o básico do HTML + - Desenvolva algumas paginas como exercícios + 2. CSS + - Aprenda o básico de CSS + - Aplique estilos nas páginas desenvolvidas anteriormente + - Desenvolva uma página com CSS Grid e CSS Flexbox + 3. Javascript + - Se familiarize com a sintaxe + - Aprenda operações basicas com o DOM + - Aprenda mecanismos típicos para JS (Hoisting, Event Bubbling, Prototyping) + - Faça algumas requisições AJAX + - Aprenda as novas features do javascript (ECMA Script 6+) + - Opcional: Conheça a biblioteca JQuery +2. Conhecimentos de desenvolvimento em geral + 1. Aprenda GIT, crie repositórios no GitHub e compartilhe seu código com outras pessoas. + 2. Aprenda os protocolos HTTP(S) e metodos de request (GET, POST, PUT, PATCH, DELETE, OPTIONS) + 3. Não tenha medo de utilizar o google, veja [o uso avançado do Google](http://www.powersearchingwithgoogle.com/) + 4. Familiarize-se com terminal e configure-o (bash, zsh, fish) + 5. Leia alguns livros sobre algoritmos e estrutura de dados + 6. Leia alguns livros sobre padrões de projeto (design patterns) +3. Aprenda React no [site oficial](https://reactjs.org/tutorial/tutorial.html) ou realize alguns [cursos](https://egghead.io/courses/the-beginner-s-guide-to-react) +4. Conheça as ferramentas que voce usará + 1. Gerenciadores de pacote + - [npm](https://www.npmjs.com/) + - [yarn](https://yarnpkg.com/lang/en/) + - [pnpm](https://pnpm.js.org/) + 2. Executadores de tarefas + - [npm scripts](https://docs.npmjs.com/misc/scripts) + - [gulp](https://gulpjs.com/) + - [Webpack](https://webpack.js.org/) + - [Rollup](https://rollupjs.org/guide/en) + - [Parcel](https://parceljs.org/) +5. Estilização + 1. Pré-processadores CSS + - [Sass/CSS](https://sass-lang.com/) + - [PostCSS](https://postcss.org/) + - [Less](http://lesscss.org/) + - [Stylus](http://stylus-lang.com/) + 2. Frameworks CSS + - [Bootstrap](https://getbootstrap.com/) + - [Materialize](https://materializecss.com/), [Material UI](https://material-ui.com/), [Material Design Lite](https://getmdl.io/) + - [Bulma](https://bulma.io/) + - [Semantic UI](https://semantic-ui.com/) + 3. Arquitetura CSS + - [BEM](http://getbem.com/) + - [CSS Modules](https://github.com/css-modules/css-modules) + - [Atomic](https://acss.io/) + - [OOCSS](https://github.com/stubbornella/oocss/wiki) + - [SMACSS](https://smacss.com/) + - [SUITCSS](https://suitcss.github.io/) + 4. CSS in JS + - [Styled Components](https://www.styled-components.com/) + - [Radium](https://formidable.com/open-source/radium/) + - [Emotion](https://emotion.sh/) + - [JSS](http://cssinjs.org/) + - [Aphrodite](https://github.com/Khan/aphrodite) +6. Gerenciamento de estado + 1. [Component State](https://reactjs.org/docs/faq-state.html)/[Context API](https://reactjs.org/docs/context.html) + 2. [Redux](https://redux.js.org/) + 1. Async actions (Side Effects) + - [Redux Thunk](https://github.com/reduxjs/redux-thunk) + - [Redux Better Promise](https://github.com/Lukasz-pluszczewski/redux-better-promise) + - [Redux Saga](https://redux-saga.js.org/) + - [Redux Observable](https://redux-observable.js.org) + 2. Helpers + - [Rematch](https://rematch.gitbooks.io/rematch/) + - [Reselect](https://github.com/reduxjs/reselect) + 3. Persistencia de dados + - [Redux Persist](https://github.com/rt2zz/redux-persist) + - [Redux Phoenix](https://github.com/adam-golab/redux-phoenix) + 4. [Redux Form](https://redux-form.com) + 3. [MobX](https://mobx.js.org/) +7. Tipagem + - [PropTypes](https://reactjs.org/docs/typechecking-with-proptypes.html) + - [TypeScript](https://www.typescriptlang.org/) + - [Flow](https://flow.org/en/) +8. Form Helpers + - [Redux Form](https://redux-form.com) + - [Formik](https://github.com/jaredpalmer/formik) + - [Formsy](https://github.com/formsy/formsy-react) + - [Final Form](https://github.com/final-form/final-form) +9. Rotas + - [React-Router](https://reacttraining.com/react-router/) + - [Router5](https://router5.js.org/) + - [Redux-First Router](https://github.com/faceyspacey/redux-first-router) + - [Reach Router](https://reach.tech/router/) +10. Clientes API + 1. REST + - [Fetch](https://developer.mozilla.org/en-US/docs/Web/API/Fetch_API) + - [SuperAgent](https://visionmedia.github.io/superagent/) + - [axios](https://github.com/axios/axios) + 2. GraphQL + - [Apollo](https://www.apollographql.com/docs/react/) + - [Relay](https://facebook.github.io/relay/) + - [urql](https://github.com/FormidableLabs/urql) +11. Bibliotecas uteis + - [Lodash](https://lodash.com/) + - [Moment](https://momentjs.com/) + - [classnames](https://github.com/JedWatson/classnames) + - [Numeral](http://numeraljs.com/) + - [RxJS](http://reactivex.io/) + - [ImmutableJS](https://facebook.github.io/immutable-js/) + - [Ramda](https://ramdajs.com/) +12. Testes + 1. Teste unitário + - [Jest](https://facebook.github.io/jest/) + - [Enzyme](http://airbnb.io/enzyme/) + - [Sinon](http://sinonjs.org/) + - [Mocha](https://mochajs.org/) + - [Chai](http://www.chaijs.com/) + - [AVA](https://github.com/avajs/ava) + - [Tape](https://github.com/substack/tape) + 2. Teste end-to-end + - [Selenium](https://www.seleniumhq.org/), [Webdriver](http://webdriver.io/) + - [Cypress](https://cypress.io/) + - [Puppeteer](https://pptr.dev/) + - [Cucumber.js](https://github.com/cucumber/cucumber-js) + - [Nightwatch.js](http://nightwatchjs.org/) + 3. Teste de integração + - [Karma](https://karma-runner.github.io/) +13. Internacionalização + - [React Intl](https://github.com/yahoo/react-intl) + - [React i18next](https://react.i18next.com/) +14. Renderização no servidor + - [Next.js](https://nextjs.org/) + - [After.js](https://github.com/jaredpalmer/after.js) + - [Rogue](https://github.com/alidcastano/rogue.js) +15. Gerador de site estático + - [Gatsby](https://www.gatsbyjs.org/) +16. Integração com estrturas de backend + - [React on Rails](https://shakacode.gitbooks.io/react-on-rails/content/) +17. Desenvolvimento de aplicativos móveis + - [React Native](https://facebook.github.io/react-native/) + - [Cordova](https://cordova.apache.org/)/[Phonegap](https://phonegap.com/) +18. Desenvolvimento de aplicativos desktop + - [Proton Native](https://proton-native.js.org/) + - [Electron](https://electronjs.org/) + - [React Native Windows](https://github.com/Microsoft/react-native-windows) +19. Realidade virtual + - [React 360](https://facebook.github.io/react-360/) + +## Resumo + +Se você acha que o guia pode ser melhorado, envie um PR com quaisquer atualizações e envie suas dúvidas. Além disso, continuarei a melhorar este repositório, então, favorite esse repositório para sempre revisitar. + +## Contribuição + +O guia foi criado com a ferramenta online [Draw.io](https://www.draw.io/). O arquivo do projeto pode ser encontrado no diretório `/src`. Para alterá-lo, abra o draw.io, clique em **Open Existing Diagram** e selecione o arquivo `xml`. Ele irá abrir o guia. Atualize o guia, faça update das imagens no readme (exporte como png) e crie um PR. + +- Abra pull request com melhorias +- Discuta novas ideias nas issues +- Compartilhe esse repositorio + +## Licença + +[![License: CC BY-NC-SA 4.0](https://img.shields.io/badge/License-CC%20BY--NC--SA%204.0-lightgrey.svg)](https://creativecommons.org/licenses/by-nc-sa/4.0/) diff --git a/README-RU.md b/README-RU.md index f2ba61c..1590764 100644 --- a/README-RU.md +++ b/README-RU.md @@ -1,186 +1,186 @@ -# План становления React-разработчиком - -[README in Chinese](README-CN.md) - -[README in English](README.md) - -[README in Japanese](README-JA.md) - -[README in Korean](README-KO.md) - -[README in Portuguese (Brazil)](README-PTBR.md) - -[README in Spanish](README-ES.md) - -> План, чтобы стать React-разработчиком в 2019 году: - -Ниже вы можете найти схему, показывающую пути, которые могут привести, а также библиотеки, которые вам нужно изучить, чтобы стать разработчиком React. Я сделал эту схему в качестве подсказки для всех, кто спрашивает меня: «Что мне стоит изучить ещё в качестве React-разработчика?» - -## Предупреждение - -> Цель этого плана — дать вам общее представление о том, как стать React-разработчиком. Этот план поможет вам, если вы запутались, что изучать дальше, вместо того, чтобы поощрять вас выбирать что-то модное и популярное. Вам стоит постепенно понимать, почему один инструмент лучше подходит для определённых ситуаций, чем другой, и не забывать, что модный и популярный инструмент не всегда означает, что он лучше всего подходит для работы. - -## План изучения - -![План изучения](./roadmap-ru.png) - -## Ресурсы - -1. Основы - 1. HTML - * Изучить основы HTML - * Сделать несколько страниц в качестве упражнения - 2. CSS - * Изучить основы CSS - * Стилизовать страницы, созданные в предыдущем шаге - * Создать страницу с использованием сеток и флексбокса - 3. Основы JS - * Познакомиться с синтаксисом - * Изучить основные операции на DOM - * Изучить механизмы, специфичные для JS (Поднятие, всплытие событий, прототипное наследование) - * Выполнить некоторые AJAX-вызовы (XHR) - * Изучить новые возможности (ECMAScript 6+) - * Дополнительно познакомиться с библиотекой jQuery -2. Общие навыки для разработки - 1. Изучить Git, создать несколько репозиториев на GitHub, поделиться своим кодом с другими - 2. Узнать о протоколе HTTP(S), методами запроса (GET, POST, PUT, PATCH, DELETE, OPTIONS) - 3. Не бояться использовать Google, посмотреть [курс по продвинутому использованию Google](http://www.powersearchingwithgoogle.com/) - 4. Познакомиться с терминалом, настроить оболочку (bash, zsh, fish) - 5. Прочитать несколько книг про алгоритмы и структуры данных - 6. Прочитать несколько книг по паттернам проектирования -3. Изучить [официальный сайт React](https://reactjs.org/tutorial/tutorial.html), пройти [курсы](https://egghead.io/courses/the-beginner-s-guide-to-react) или прочитать [книги](https://github.com/EbookFoundation/free-programming-books/blob/master/free-programming-books-ru.md#react) -4. Познакомиться с инструментами, которые вы будете использовать - 1. Менеджеры пакетов - * [npm](https://www.npmjs.com/) - * [yarn](https://yarnpkg.com/lang/en/) - * [pnpm](https://pnpm.js.org/) - 2. Выполнение задач - * [npm-скрипты](https://docs.npmjs.com/misc/scripts) - * [gulp](https://gulpjs.com/) - * [Webpack](https://webpack.js.org/) - * [Rollup](https://rollupjs.org/guide/en) - * [Parcel](https://parceljs.org/) -5. Стилизация - 1. CSS-препроцессоры - * [Sass/CSS](https://sass-lang.com/) - * [PostCSS](https://postcss.org/) - * [Less](http://lesscss.org/) - * [Stylus](http://stylus-lang.com/) - 2. CSS-фреймворки - * [Bootstrap](https://getbootstrap.com/) - * [Materialize](https://materializecss.com/), [Material UI](https://material-ui.com/), [Material Design Lite](https://getmdl.io/) - * [Bulma](https://bulma.io/) - * [Semantic UI](https://semantic-ui.com/) - 3. Архитектура CSS - * [BEM](http://getbem.com/) - * [CSS Modules](https://github.com/css-modules/css-modules) - * [Atomic](https://acss.io/) - * [OOCSS](https://github.com/stubbornella/oocss/wiki) - * [SMACSS](https://smacss.com/) - * [SUITCSS](https://suitcss.github.io/) - 4. CSS в JS - * [Styled Components](https://www.styled-components.com/) - * [Radium](https://formidable.com/open-source/radium/) - * [Emotion](https://emotion.sh/) - * [JSS](http://cssinjs.org/) - * [Aphrodite](https://github.com/Khan/aphrodite) -6. Управление состоянием - 1. [Состояние компонента](https://reactjs.org/docs/faq-state.html)/[Context API](https://reactjs.org/docs/context.html) - 2. [Redux](https://redux.js.org/) - 1. Асинхронные действия (побочные эффекты) - * [Redux Thunk](https://github.com/reduxjs/redux-thunk) - * [Redux Better Promise](https://github.com/Lukasz-pluszczewski/redux-better-promise) - * [Redux Saga](https://redux-saga.js.org/) - * [Redux Observable](https://redux-observable.js.org) - 2. Библиотеки-помощники - * [Rematch](https://rematch.gitbooks.io/rematch/) - * [Reselect](https://github.com/reduxjs/reselect) - 3. Постоянное хранение данных - * [Redux Persist](https://github.com/rt2zz/redux-persist) - * [Redux Phoenix](https://github.com/adam-golab/redux-phoenix) - 4. [Redux Form](https://redux-form.com) - 3. [MobX](https://mobx.js.org/) -7. Проверка типов - * [PropTypes](https://reactjs.org/docs/typechecking-with-proptypes.html) - * [TypeScript](https://www.typescriptlang.org/) - * [Flow](https://flow.org/en/) -8. Вспомогательные библиотеки для форм - * [Redux Form](https://redux-form.com) - * [Formik](https://github.com/jaredpalmer/formik) - * [Formsy](https://github.com/formsy/formsy-react) - * [Final Form](https://github.com/final-form/final-form) -9. Маршрутизация - * [React-Router](https://reacttraining.com/react-router/) - * [Router5](https://router5.js.org/) - * [Redux-First Router](https://github.com/faceyspacey/redux-first-router) - * [Reach Router](https://reach.tech/router/) -10. API-клиенты - 1. REST - * [Fetch](https://developer.mozilla.org/en-US/docs/Web/API/Fetch_API) - * [SuperAgent](https://visionmedia.github.io/superagent/) - * [axios](https://github.com/axios/axios) - 2. GraphQL - * [Apollo](https://www.apollographql.com/docs/react/) - * [Relay](https://facebook.github.io/relay/) - * [urql](https://github.com/FormidableLabs/urql) -11. Утилитарные библиотеки - * [Lodash](https://lodash.com/) - * [Moment](https://momentjs.com/) - * [classnames](https://github.com/JedWatson/classnames) - * [Numeral](http://numeraljs.com/) - * [RxJS](http://reactivex.io/) - * [ImmutableJS](https://facebook.github.io/immutable-js/) - * [Ramda](https://ramdajs.com/) -12. Тестирование - 1. Модульное тестирование - * [Jest](https://facebook.github.io/jest/) - * [Enzyme](http://airbnb.io/enzyme/) - * [Sinon](http://sinonjs.org/) - * [Mocha](https://mochajs.org/) - * [Chai](http://www.chaijs.com/) - * [AVA](https://github.com/avajs/ava) - * [Tape](https://github.com/substack/tape) - 2. Сквозное (end-to-end) тестирование - * [Selenium](https://www.seleniumhq.org/), [Webdriver](http://webdriver.io/) - * [Cypress](https://cypress.io/) - * [Puppeteer](https://pptr.dev/) - * [Cucumber.js](https://github.com/cucumber/cucumber-js) - * [Nightwatch.js](http://nightwatchjs.org/) - 3. Интеграционное тестирование - * [Karma](https://karma-runner.github.io/) -13. Локализация - * [React Intl](https://github.com/yahoo/react-intl) - * [React i18next](https://react.i18next.com/) -14. Отрисовка на стороне сервера - * [Next.js](https://nextjs.org/) - * [After.js](https://github.com/jaredpalmer/after.js) - * [Rogue](https://github.com/alidcastano/rogue.js) -15. Генератор статических сайтов - * [Gatsby](https://www.gatsbyjs.org/) -16. Интеграция с бэкенд-фреймворками - * [React on Rails](https://shakacode.gitbooks.io/react-on-rails/content/) -17. Разработка мобильных приложений - * [React Native](https://facebook.github.io/react-native/) - * [Cordova](https://cordova.apache.org/)/[Phonegap](https://phonegap.com/) -18. Разработка десктопных приложений - * [Proton Native](https://proton-native.js.org/) - * [Electron](https://electronjs.org/) - * [React Native Windows](https://github.com/Microsoft/react-native-windows) -19. Виртуальная реальность - * [React 360](https://facebook.github.io/react-360/) - -## Резюме - -Если вы считаете, что план может быть улучшен, пожалуйста, создайте пулреквест с любыми обновлениями и отправляйте любые ишью, если есть вопросы и предложения. Кроме того, я продолжу улучшать его, так что, возможно, стоит отслеживать изменения, происходящие в этом репозитории, либо заглянуть в него спустя некоторое время. - -## Участие в проекте - -План создан с помощью онлайн-инструмента [Draw.io](https://www.draw.io/). Файл проекта можно найти в каталоге `/src`. Чтобы изменить его, откройте draw.io, нажмите **Open Existing Diagram** и выберите файл `xml` с проектом. Он откроет схему, обновите её, загрузите и обновите изображения в readme и создайте PR (экспортируйте как png). - -- Открыть пулреквест с улучшениями -- Обсуждайте новые идеи в ишью -- Расскажите об этом другим - -## Лицензия - -[![License: CC BY-NC-SA 4.0](https://img.shields.io/badge/License-CC%20BY--NC--SA%204.0-lightgrey.svg)](https://creativecommons.org/licenses/by-nc-sa/4.0/) +# План становления React-разработчиком + +[README in Chinese](README-CN.md) + +[README in English](README.md) + +[README in Japanese](README-JA.md) + +[README in Korean](README-KO.md) + +[README in Portuguese (Brazil)](README-PTBR.md) + +[README in Spanish](README-ES.md) + +> План, чтобы стать React-разработчиком в 2019 году: + +Ниже вы можете найти схему, показывающую пути, которые могут привести, а также библиотеки, которые вам нужно изучить, чтобы стать разработчиком React. Я сделал эту схему в качестве подсказки для всех, кто спрашивает меня: «Что мне стоит изучить ещё в качестве React-разработчика?» + +## Предупреждение + +> Цель этого плана — дать вам общее представление о том, как стать React-разработчиком. Этот план поможет вам, если вы запутались, что изучать дальше, вместо того, чтобы поощрять вас выбирать что-то модное и популярное. Вам стоит постепенно понимать, почему один инструмент лучше подходит для определённых ситуаций, чем другой, и не забывать, что модный и популярный инструмент не всегда означает, что он лучше всего подходит для работы. + +## План изучения + +![План изучения](./roadmap-ru.png) + +## Ресурсы + +1. Основы + 1. HTML + * Изучить основы HTML + * Сделать несколько страниц в качестве упражнения + 2. CSS + * Изучить основы CSS + * Стилизовать страницы, созданные в предыдущем шаге + * Создать страницу с использованием сеток и флексбокса + 3. Основы JS + * Познакомиться с синтаксисом + * Изучить основные операции на DOM + * Изучить механизмы, специфичные для JS (Поднятие, всплытие событий, прототипное наследование) + * Выполнить некоторые AJAX-вызовы (XHR) + * Изучить новые возможности (ECMAScript 6+) + * Дополнительно познакомиться с библиотекой jQuery +2. Общие навыки для разработки + 1. Изучить Git, создать несколько репозиториев на GitHub, поделиться своим кодом с другими + 2. Узнать о протоколе HTTP(S), методами запроса (GET, POST, PUT, PATCH, DELETE, OPTIONS) + 3. Не бояться использовать Google, посмотреть [курс по продвинутому использованию Google](http://www.powersearchingwithgoogle.com/) + 4. Познакомиться с терминалом, настроить оболочку (bash, zsh, fish) + 5. Прочитать несколько книг про алгоритмы и структуры данных + 6. Прочитать несколько книг по паттернам проектирования +3. Изучить [официальный сайт React](https://reactjs.org/tutorial/tutorial.html), пройти [курсы](https://egghead.io/courses/the-beginner-s-guide-to-react) или прочитать [книги](https://github.com/EbookFoundation/free-programming-books/blob/master/free-programming-books-ru.md#react) +4. Познакомиться с инструментами, которые вы будете использовать + 1. Менеджеры пакетов + * [npm](https://www.npmjs.com/) + * [yarn](https://yarnpkg.com/lang/en/) + * [pnpm](https://pnpm.js.org/) + 2. Выполнение задач + * [npm-скрипты](https://docs.npmjs.com/misc/scripts) + * [gulp](https://gulpjs.com/) + * [Webpack](https://webpack.js.org/) + * [Rollup](https://rollupjs.org/guide/en) + * [Parcel](https://parceljs.org/) +5. Стилизация + 1. CSS-препроцессоры + * [Sass/CSS](https://sass-lang.com/) + * [PostCSS](https://postcss.org/) + * [Less](http://lesscss.org/) + * [Stylus](http://stylus-lang.com/) + 2. CSS-фреймворки + * [Bootstrap](https://getbootstrap.com/) + * [Materialize](https://materializecss.com/), [Material UI](https://material-ui.com/), [Material Design Lite](https://getmdl.io/) + * [Bulma](https://bulma.io/) + * [Semantic UI](https://semantic-ui.com/) + 3. Архитектура CSS + * [BEM](http://getbem.com/) + * [CSS Modules](https://github.com/css-modules/css-modules) + * [Atomic](https://acss.io/) + * [OOCSS](https://github.com/stubbornella/oocss/wiki) + * [SMACSS](https://smacss.com/) + * [SUITCSS](https://suitcss.github.io/) + 4. CSS в JS + * [Styled Components](https://www.styled-components.com/) + * [Radium](https://formidable.com/open-source/radium/) + * [Emotion](https://emotion.sh/) + * [JSS](http://cssinjs.org/) + * [Aphrodite](https://github.com/Khan/aphrodite) +6. Управление состоянием + 1. [Состояние компонента](https://reactjs.org/docs/faq-state.html)/[Context API](https://reactjs.org/docs/context.html) + 2. [Redux](https://redux.js.org/) + 1. Асинхронные действия (побочные эффекты) + * [Redux Thunk](https://github.com/reduxjs/redux-thunk) + * [Redux Better Promise](https://github.com/Lukasz-pluszczewski/redux-better-promise) + * [Redux Saga](https://redux-saga.js.org/) + * [Redux Observable](https://redux-observable.js.org) + 2. Библиотеки-помощники + * [Rematch](https://rematch.gitbooks.io/rematch/) + * [Reselect](https://github.com/reduxjs/reselect) + 3. Постоянное хранение данных + * [Redux Persist](https://github.com/rt2zz/redux-persist) + * [Redux Phoenix](https://github.com/adam-golab/redux-phoenix) + 4. [Redux Form](https://redux-form.com) + 3. [MobX](https://mobx.js.org/) +7. Проверка типов + * [PropTypes](https://reactjs.org/docs/typechecking-with-proptypes.html) + * [TypeScript](https://www.typescriptlang.org/) + * [Flow](https://flow.org/en/) +8. Вспомогательные библиотеки для форм + * [Redux Form](https://redux-form.com) + * [Formik](https://github.com/jaredpalmer/formik) + * [Formsy](https://github.com/formsy/formsy-react) + * [Final Form](https://github.com/final-form/final-form) +9. Маршрутизация + * [React-Router](https://reacttraining.com/react-router/) + * [Router5](https://router5.js.org/) + * [Redux-First Router](https://github.com/faceyspacey/redux-first-router) + * [Reach Router](https://reach.tech/router/) +10. API-клиенты + 1. REST + * [Fetch](https://developer.mozilla.org/en-US/docs/Web/API/Fetch_API) + * [SuperAgent](https://visionmedia.github.io/superagent/) + * [axios](https://github.com/axios/axios) + 2. GraphQL + * [Apollo](https://www.apollographql.com/docs/react/) + * [Relay](https://facebook.github.io/relay/) + * [urql](https://github.com/FormidableLabs/urql) +11. Утилитарные библиотеки + * [Lodash](https://lodash.com/) + * [Moment](https://momentjs.com/) + * [classnames](https://github.com/JedWatson/classnames) + * [Numeral](http://numeraljs.com/) + * [RxJS](http://reactivex.io/) + * [ImmutableJS](https://facebook.github.io/immutable-js/) + * [Ramda](https://ramdajs.com/) +12. Тестирование + 1. Модульное тестирование + * [Jest](https://facebook.github.io/jest/) + * [Enzyme](http://airbnb.io/enzyme/) + * [Sinon](http://sinonjs.org/) + * [Mocha](https://mochajs.org/) + * [Chai](http://www.chaijs.com/) + * [AVA](https://github.com/avajs/ava) + * [Tape](https://github.com/substack/tape) + 2. Сквозное (end-to-end) тестирование + * [Selenium](https://www.seleniumhq.org/), [Webdriver](http://webdriver.io/) + * [Cypress](https://cypress.io/) + * [Puppeteer](https://pptr.dev/) + * [Cucumber.js](https://github.com/cucumber/cucumber-js) + * [Nightwatch.js](http://nightwatchjs.org/) + 3. Интеграционное тестирование + * [Karma](https://karma-runner.github.io/) +13. Локализация + * [React Intl](https://github.com/yahoo/react-intl) + * [React i18next](https://react.i18next.com/) +14. Отрисовка на стороне сервера + * [Next.js](https://nextjs.org/) + * [After.js](https://github.com/jaredpalmer/after.js) + * [Rogue](https://github.com/alidcastano/rogue.js) +15. Генератор статических сайтов + * [Gatsby](https://www.gatsbyjs.org/) +16. Интеграция с бэкенд-фреймворками + * [React on Rails](https://shakacode.gitbooks.io/react-on-rails/content/) +17. Разработка мобильных приложений + * [React Native](https://facebook.github.io/react-native/) + * [Cordova](https://cordova.apache.org/)/[Phonegap](https://phonegap.com/) +18. Разработка десктопных приложений + * [Proton Native](https://proton-native.js.org/) + * [Electron](https://electronjs.org/) + * [React Native Windows](https://github.com/Microsoft/react-native-windows) +19. Виртуальная реальность + * [React 360](https://facebook.github.io/react-360/) + +## Резюме + +Если вы считаете, что план может быть улучшен, пожалуйста, создайте пулреквест с любыми обновлениями и отправляйте любые ишью, если есть вопросы и предложения. Кроме того, я продолжу улучшать его, так что, возможно, стоит отслеживать изменения, происходящие в этом репозитории, либо заглянуть в него спустя некоторое время. + +## Участие в проекте + +План создан с помощью онлайн-инструмента [Draw.io](https://www.draw.io/). Файл проекта можно найти в каталоге `/src`. Чтобы изменить его, откройте draw.io, нажмите **Open Existing Diagram** и выберите файл `xml` с проектом. Он откроет схему, обновите её, загрузите и обновите изображения в readme и создайте PR (экспортируйте как png). + +- Открыть пулреквест с улучшениями +- Обсуждайте новые идеи в ишью +- Расскажите об этом другим + +## Лицензия + +[![License: CC BY-NC-SA 4.0](https://img.shields.io/badge/License-CC%20BY--NC--SA%204.0-lightgrey.svg)](https://creativecommons.org/licenses/by-nc-sa/4.0/) diff --git a/README.md b/README.md index bf0fdc8..e93044d 100644 --- a/README.md +++ b/README.md @@ -1,185 +1,185 @@ -# React Developer Roadmap - -[README in Chinese](README-CN.md) - -[README in Japanese](README-JA.md) - -[README in Korean](README-KO.md) - -[README in Portuguese (Brazil)](README-PTBR.md) - -[README in Russian](README-RU.md) - -[README in Spanish](README-ES.md) - -> Roadmap to becoming a React developer in 2019: - -Below you can find a chart demonstrating the paths that you can take and the libraries that you would want to learn to become a React developer. I made this chart as a tip for everyone who asks me, "What should I learn next as a React developer?" - -## Disclaimer -> The purpose of this roadmap is to give you an idea about the landscape. The road map will guide you if you are confused about what to learn next, rather than encouraging you to pick what is hip and trendy. You should grow some understanding of why one tool would be better suited for some cases than the other and remember hip and trendy does not always mean best suited for the job - -## Roadmap - -![Roadmap](./roadmap.png) - -## Resources - -1. Basics - 1. HTML - * Learn the basics of HTML - * Make a few pages as an exercise - 2. CSS - * Learn the basics of CSS - * Style pages from previous step - * Build a page with grid and flexbox - 3. JS Basics - * Get familiar with the syntax - * Learn basic operations on DOM - * Learn mechanisms typical for JS (Hoisting, Event Bubbling, Prototyping) - * Make some AJAX (XHR) calls - * Learn new features (ECMA Script 6+) - * Additionally, get familiar with the jQuery library -2. General Development Skills - 1. Learn GIT, create a few repositories on GitHub, share your code with other people - 2. Know HTTP(S) protocol, request methods (GET, POST, PUT, PATCH, DELETE, OPTIONS) - 3. Don't be afraid of using Google, [Power Searching with Google](http://www.powersearchingwithgoogle.com/) - 4. Get familiar with terminal, configure your shell (bash, zsh, fish) - 5. Read a few books about algorithms and data structures - 6. Read a few books about design patterns -3. Learn React on [official website](https://reactjs.org/tutorial/tutorial.html) or complete some [courses](https://egghead.io/courses/the-beginner-s-guide-to-react) -4. Get familiar with tools that you will be using - 1. Package Managers - * [npm](https://www.npmjs.com/) - * [yarn](https://yarnpkg.com/lang/en/) - * [pnpm](https://pnpm.js.org/) - 2. Task Runners - * [npm scripts](https://docs.npmjs.com/misc/scripts) - * [gulp](https://gulpjs.com/) - * [Webpack](https://webpack.js.org/) - * [Rollup](https://rollupjs.org/guide/en) - * [Parcel](https://parceljs.org/) -5. Styling - 1. CSS Preprocessor - * [Sass/CSS](https://sass-lang.com/) - * [PostCSS](https://postcss.org/) - * [Less](http://lesscss.org/) - * [Stylus](http://stylus-lang.com/) - 2. CSS Frameworks - * [Bootstrap](https://getbootstrap.com/) - * [Materialize](https://materializecss.com/), [Material UI](https://material-ui.com/), [Material Design Lite](https://getmdl.io/) - * [Bulma](https://bulma.io/) - * [Semantic UI](https://semantic-ui.com/) - 3. CSS Architecture - * [BEM](http://getbem.com/) - * [CSS Modules](https://github.com/css-modules/css-modules) - * [Atomic](https://acss.io/) - * [OOCSS](https://github.com/stubbornella/oocss/wiki) - * [SMACSS](https://smacss.com/) - * [SUITCSS](https://suitcss.github.io/) - 4. CSS in JS - * [Styled Components](https://www.styled-components.com/) - * [Radium](https://formidable.com/open-source/radium/) - * [Emotion](https://emotion.sh/) - * [JSS](http://cssinjs.org/) - * [Aphrodite](https://github.com/Khan/aphrodite) -6. State Management - 1. [Component State](https://reactjs.org/docs/faq-state.html)/[Context API](https://reactjs.org/docs/context.html) - 2. [Redux](https://redux.js.org/) - 1. Async actions (Side Effects) - * [Redux Thunk](https://github.com/reduxjs/redux-thunk) - * [Redux Better Promise](https://github.com/Lukasz-pluszczewski/redux-better-promise) - * [Redux Saga](https://redux-saga.js.org/) - * [Redux Observable](https://redux-observable.js.org) - 2. Helpers - * [Rematch](https://rematch.gitbooks.io/rematch/) - * [Reselect](https://github.com/reduxjs/reselect) - 3. Data persistence - * [Redux Persist](https://github.com/rt2zz/redux-persist) - * [Redux Phoenix](https://github.com/adam-golab/redux-phoenix) - 4. [Redux Form](https://redux-form.com) - 3. [MobX](https://mobx.js.org/) -7. Type Checkers - * [PropTypes](https://reactjs.org/docs/typechecking-with-proptypes.html) - * [TypeScript](https://www.typescriptlang.org/) - * [Flow](https://flow.org/en/) -8. Form Helpers - * [Redux Form](https://redux-form.com) - * [Formik](https://github.com/jaredpalmer/formik) - * [Formsy](https://github.com/formsy/formsy-react) - * [Final Form](https://github.com/final-form/final-form) -9. Routing - * [React-Router](https://reacttraining.com/react-router/) - * [Router5](https://router5.js.org/) - * [Redux-First Router](https://github.com/faceyspacey/redux-first-router) - * [Reach Router](https://reach.tech/router/) -10. API Clients - 1. REST - * [Fetch](https://developer.mozilla.org/en-US/docs/Web/API/Fetch_API) - * [SuperAgent](https://visionmedia.github.io/superagent/) - * [axios](https://github.com/axios/axios) - 2. GraphQL - * [Apollo](https://www.apollographql.com/docs/react/) - * [Relay](https://facebook.github.io/relay/) - * [urql](https://github.com/FormidableLabs/urql) -11. Utility Libraries - * [Lodash](https://lodash.com/) - * [Moment](https://momentjs.com/) - * [classnames](https://github.com/JedWatson/classnames) - * [Numeral](http://numeraljs.com/) - * [RxJS](http://reactivex.io/) - * [ImmutableJS](https://facebook.github.io/immutable-js/) - * [Ramda](https://ramdajs.com/) -12. Testing - 1. Unit Testing - * [Jest](https://facebook.github.io/jest/) - * [Enzyme](http://airbnb.io/enzyme/) - * [Sinon](http://sinonjs.org/) - * [Mocha](https://mochajs.org/) - * [Chai](http://www.chaijs.com/) - * [AVA](https://github.com/avajs/ava) - * [Tape](https://github.com/substack/tape) - 2. End to End Testing - * [Selenium](https://www.seleniumhq.org/), [Webdriver](http://webdriver.io/) - * [Cypress](https://cypress.io/) - * [Puppeteer](https://pptr.dev/) - * [Cucumber.js](https://github.com/cucumber/cucumber-js) - * [Nightwatch.js](http://nightwatchjs.org/) - 3. Integration Testing - * [Karma](https://karma-runner.github.io/) -13. Internationalization - * [React Intl](https://github.com/yahoo/react-intl) - * [React i18next](https://react.i18next.com/) -14. Server Side Rendering - * [Next.js](https://nextjs.org/) - * [After.js](https://github.com/jaredpalmer/after.js) - * [Rogue](https://github.com/alidcastano/rogue.js) -15. Static Site Generator - * [Gatsby](https://www.gatsbyjs.org/) -16. Backend Framework Integration - * [React on Rails](https://shakacode.gitbooks.io/react-on-rails/content/) -17. Mobile - * [React Native](https://facebook.github.io/react-native/) - * [Cordova](https://cordova.apache.org/)/[Phonegap](https://phonegap.com/) -18. Desktop - * [Proton Native](https://proton-native.js.org/) - * [Electron](https://electronjs.org/) - * [React Native Windows](https://github.com/Microsoft/react-native-windows) -19. Virtual Reality - * [React 360](https://facebook.github.io/react-360/) - -## Wrap Up - -If you think the roadmap can be improved, please do open a PR with any updates and submit any issues. Also, I will continue to improve this, so you might want to star this repository to revisit. - -## Contribution - -The roadmap is built using [Draw.io](https://www.draw.io/). Project file can be found at `/src` directory. To modify it, open draw.io, click **Open Existing Diagram** and choose `xml` file with project. It will open the roadmap for you. Update it, upload and update the images in readme and create a PR (export as png). - -- Open a pull request with improvements -- Discuss ideas in issues -- Spread the word - -## License - -[![License: CC BY-NC-SA 4.0](https://img.shields.io/badge/License-CC%20BY--NC--SA%204.0-lightgrey.svg)](https://creativecommons.org/licenses/by-nc-sa/4.0/) +# React Developer Roadmap + +[README in Chinese](README-CN.md) + +[README in Japanese](README-JA.md) + +[README in Korean](README-KO.md) + +[README in Portuguese (Brazil)](README-PTBR.md) + +[README in Russian](README-RU.md) + +[README in Spanish](README-ES.md) + +> Roadmap to becoming a React developer in 2019: + +Below you can find a chart demonstrating the paths that you can take and the libraries that you would want to learn to become a React developer. I made this chart as a tip for everyone who asks me, "What should I learn next as a React developer?" + +## Disclaimer +> The purpose of this roadmap is to give you an idea about the landscape. The road map will guide you if you are confused about what to learn next, rather than encouraging you to pick what is hip and trendy. You should grow some understanding of why one tool would be better suited for some cases than the other and remember hip and trendy does not always mean best suited for the job + +## Roadmap + +![Roadmap](./roadmap.png) + +## Resources + +1. Basics + 1. HTML + * Learn the basics of HTML + * Make a few pages as an exercise + 2. CSS + * Learn the basics of CSS + * Style pages from previous step + * Build a page with grid and flexbox + 3. JS Basics + * Get familiar with the syntax + * Learn basic operations on DOM + * Learn mechanisms typical for JS (Hoisting, Event Bubbling, Prototyping) + * Make some AJAX (XHR) calls + * Learn new features (ECMA Script 6+) + * Additionally, get familiar with the jQuery library +2. General Development Skills + 1. Learn GIT, create a few repositories on GitHub, share your code with other people + 2. Know HTTP(S) protocol, request methods (GET, POST, PUT, PATCH, DELETE, OPTIONS) + 3. Don't be afraid of using Google, [Power Searching with Google](http://www.powersearchingwithgoogle.com/) + 4. Get familiar with terminal, configure your shell (bash, zsh, fish) + 5. Read a few books about algorithms and data structures + 6. Read a few books about design patterns +3. Learn React on [official website](https://reactjs.org/tutorial/tutorial.html) or complete some [courses](https://egghead.io/courses/the-beginner-s-guide-to-react) +4. Get familiar with tools that you will be using + 1. Package Managers + * [npm](https://www.npmjs.com/) + * [yarn](https://yarnpkg.com/lang/en/) + * [pnpm](https://pnpm.js.org/) + 2. Task Runners + * [npm scripts](https://docs.npmjs.com/misc/scripts) + * [gulp](https://gulpjs.com/) + * [Webpack](https://webpack.js.org/) + * [Rollup](https://rollupjs.org/guide/en) + * [Parcel](https://parceljs.org/) +5. Styling + 1. CSS Preprocessor + * [Sass/CSS](https://sass-lang.com/) + * [PostCSS](https://postcss.org/) + * [Less](http://lesscss.org/) + * [Stylus](http://stylus-lang.com/) + 2. CSS Frameworks + * [Bootstrap](https://getbootstrap.com/) + * [Materialize](https://materializecss.com/), [Material UI](https://material-ui.com/), [Material Design Lite](https://getmdl.io/) + * [Bulma](https://bulma.io/) + * [Semantic UI](https://semantic-ui.com/) + 3. CSS Architecture + * [BEM](http://getbem.com/) + * [CSS Modules](https://github.com/css-modules/css-modules) + * [Atomic](https://acss.io/) + * [OOCSS](https://github.com/stubbornella/oocss/wiki) + * [SMACSS](https://smacss.com/) + * [SUITCSS](https://suitcss.github.io/) + 4. CSS in JS + * [Styled Components](https://www.styled-components.com/) + * [Radium](https://formidable.com/open-source/radium/) + * [Emotion](https://emotion.sh/) + * [JSS](http://cssinjs.org/) + * [Aphrodite](https://github.com/Khan/aphrodite) +6. State Management + 1. [Component State](https://reactjs.org/docs/faq-state.html)/[Context API](https://reactjs.org/docs/context.html) + 2. [Redux](https://redux.js.org/) + 1. Async actions (Side Effects) + * [Redux Thunk](https://github.com/reduxjs/redux-thunk) + * [Redux Better Promise](https://github.com/Lukasz-pluszczewski/redux-better-promise) + * [Redux Saga](https://redux-saga.js.org/) + * [Redux Observable](https://redux-observable.js.org) + 2. Helpers + * [Rematch](https://rematch.gitbooks.io/rematch/) + * [Reselect](https://github.com/reduxjs/reselect) + 3. Data persistence + * [Redux Persist](https://github.com/rt2zz/redux-persist) + * [Redux Phoenix](https://github.com/adam-golab/redux-phoenix) + 4. [Redux Form](https://redux-form.com) + 3. [MobX](https://mobx.js.org/) +7. Type Checkers + * [PropTypes](https://reactjs.org/docs/typechecking-with-proptypes.html) + * [TypeScript](https://www.typescriptlang.org/) + * [Flow](https://flow.org/en/) +8. Form Helpers + * [Redux Form](https://redux-form.com) + * [Formik](https://github.com/jaredpalmer/formik) + * [Formsy](https://github.com/formsy/formsy-react) + * [Final Form](https://github.com/final-form/final-form) +9. Routing + * [React-Router](https://reacttraining.com/react-router/) + * [Router5](https://router5.js.org/) + * [Redux-First Router](https://github.com/faceyspacey/redux-first-router) + * [Reach Router](https://reach.tech/router/) +10. API Clients + 1. REST + * [Fetch](https://developer.mozilla.org/en-US/docs/Web/API/Fetch_API) + * [SuperAgent](https://visionmedia.github.io/superagent/) + * [axios](https://github.com/axios/axios) + 2. GraphQL + * [Apollo](https://www.apollographql.com/docs/react/) + * [Relay](https://facebook.github.io/relay/) + * [urql](https://github.com/FormidableLabs/urql) +11. Utility Libraries + * [Lodash](https://lodash.com/) + * [Moment](https://momentjs.com/) + * [classnames](https://github.com/JedWatson/classnames) + * [Numeral](http://numeraljs.com/) + * [RxJS](http://reactivex.io/) + * [ImmutableJS](https://facebook.github.io/immutable-js/) + * [Ramda](https://ramdajs.com/) +12. Testing + 1. Unit Testing + * [Jest](https://facebook.github.io/jest/) + * [Enzyme](http://airbnb.io/enzyme/) + * [Sinon](http://sinonjs.org/) + * [Mocha](https://mochajs.org/) + * [Chai](http://www.chaijs.com/) + * [AVA](https://github.com/avajs/ava) + * [Tape](https://github.com/substack/tape) + 2. End to End Testing + * [Selenium](https://www.seleniumhq.org/), [Webdriver](http://webdriver.io/) + * [Cypress](https://cypress.io/) + * [Puppeteer](https://pptr.dev/) + * [Cucumber.js](https://github.com/cucumber/cucumber-js) + * [Nightwatch.js](http://nightwatchjs.org/) + 3. Integration Testing + * [Karma](https://karma-runner.github.io/) +13. Internationalization + * [React Intl](https://github.com/yahoo/react-intl) + * [React i18next](https://react.i18next.com/) +14. Server Side Rendering + * [Next.js](https://nextjs.org/) + * [After.js](https://github.com/jaredpalmer/after.js) + * [Rogue](https://github.com/alidcastano/rogue.js) +15. Static Site Generator + * [Gatsby](https://www.gatsbyjs.org/) +16. Backend Framework Integration + * [React on Rails](https://shakacode.gitbooks.io/react-on-rails/content/) +17. Mobile + * [React Native](https://facebook.github.io/react-native/) + * [Cordova](https://cordova.apache.org/)/[Phonegap](https://phonegap.com/) +18. Desktop + * [Proton Native](https://proton-native.js.org/) + * [Electron](https://electronjs.org/) + * [React Native Windows](https://github.com/Microsoft/react-native-windows) +19. Virtual Reality + * [React 360](https://facebook.github.io/react-360/) + +## Wrap Up + +If you think the roadmap can be improved, please do open a PR with any updates and submit any issues. Also, I will continue to improve this, so you might want to star this repository to revisit. + +## Contribution + +The roadmap is built using [Draw.io](https://www.draw.io/). Project file can be found at `/src` directory. To modify it, open draw.io, click **Open Existing Diagram** and choose `xml` file with project. It will open the roadmap for you. Update it, upload and update the images in readme and create a PR (export as png). + +- Open a pull request with improvements +- Discuss ideas in issues +- Spread the word + +## License + +[![License: CC BY-NC-SA 4.0](https://img.shields.io/badge/License-CC%20BY--NC--SA%204.0-lightgrey.svg)](https://creativecommons.org/licenses/by-nc-sa/4.0/) diff --git a/src/react-developer-roadmap-cn.xml b/src/react-developer-roadmap-cn.xml index ecca217..90075dd 100644 --- a/src/react-developer-roadmap-cn.xml +++ b/src/react-developer-roadmap-cn.xml @@ -1,1907 +1,1907 @@ - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/src/react-developer-roadmap-es.xml b/src/react-developer-roadmap-es.xml index b38dc17..1f4a7b5 100644 --- a/src/react-developer-roadmap-es.xml +++ b/src/react-developer-roadmap-es.xml @@ -1,1907 +1,1907 @@ - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/src/react-developer-roadmap-ja.xml b/src/react-developer-roadmap-ja.xml index e03dd4a..3c60755 100644 --- a/src/react-developer-roadmap-ja.xml +++ b/src/react-developer-roadmap-ja.xml @@ -1,1907 +1,1907 @@ - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/src/react-developer-roadmap-pt-br.xml b/src/react-developer-roadmap-pt-br.xml index 250c463..e5a09f6 100644 --- a/src/react-developer-roadmap-pt-br.xml +++ b/src/react-developer-roadmap-pt-br.xml @@ -1,1907 +1,1907 @@ - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/src/react-developer-roadmap-ru.xml b/src/react-developer-roadmap-ru.xml index 5ec4589..072d486 100644 --- a/src/react-developer-roadmap-ru.xml +++ b/src/react-developer-roadmap-ru.xml @@ -1,1907 +1,1907 @@ - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/src/react-developer-roadmap.xml b/src/react-developer-roadmap.xml index 529cc0a..0939b02 100644 --- a/src/react-developer-roadmap.xml +++ b/src/react-developer-roadmap.xml @@ -1,1907 +1,1907 @@ - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/translations/README-FR.md b/translations/README-FR.md new file mode 100644 index 0000000..f92b585 --- /dev/null +++ b/translations/README-FR.md @@ -0,0 +1,110 @@ +# React Developer Roadmap + +[README en chinois] (README-CN.md) + +[README en japonais] (README-JA.md) + +[README en coréen] (README-KO.md) + +[README en portugais (Brésil)] (README-PTBR.md) + +[README en russe] (README-RU.md) + +[README en espagnol] (README-ES.md) + +> Feuille de route pour devenir développeur React en 2019: + +Vous trouverez ci-dessous un graphique illustrant les chemins que vous pouvez emprunter et les bibliothèques que vous voudriez apprendre pour devenir développeur React. J'ai créé ce graphique comme une astuce pour tous ceux qui me demandent: "Que dois-je apprendre ensuite en tant que développeur React?" + +## Avertissement + +> Le but de cette feuille de route est de vous donner une idée du paysage. La feuille de route vous guidera si vous ne savez pas quoi apprendre ensuite, plutôt que de vous encourager à choisir ce qui est branché et à la mode. Vous devriez mieux comprendre pourquoi un outil serait mieux adapté à certains cas que l'autre et rappelez-vous que branché et à la mode ne signifie pas toujours le mieux adapté au travail. + +## Feuille de route + +! [Feuille de route] (./ roadmap.png) + +## Ressources + +1. Bases + 1. HTML + - Apprenez les bases du HTML + - Faites quelques pages comme exercice + 2. CSS + - Apprenez les bases du CSS + - Pages de style de l'étape précédente + - Construire une page avec grille et flexbox + 3. Principes de base de JS + - Familiarisez-vous avec la syntaxe + - Apprenez les opérations de base sur DOM + - Apprenez les mécanismes typiques pour JS (levage, bulles d'événement, prototypage) + - Passer des appels AJAX (XHR) + - Apprenez de nouvelles fonctionnalités (ECMA Script 6+) + - De plus, familiarisez-vous avec la bibliothèque jQuery +2. Compétences générales de développement + 1. Apprenez GIT, créez quelques dépôts sur GitHub, partagez votre code avec d'autres personnes + 2. Connaître le protocole HTTP (S), les méthodes de requête (GET, POST, PUT, PATCH, DELETE, OPTIONS) + 3. N'ayez pas peur d'utiliser Google, [Power Searching with Google] (http://www.powersearchingwithgoogle.com/) + 4. Familiarisez-vous avec le terminal, configurez votre shell (bash, zsh, fish) + 5. Lisez quelques livres sur les algorithmes et les structures de données + 6. Lisez quelques livres sur les modèles de conception +3. Apprenez React sur [site officiel] (https://reactjs.org/tutorial/tutorial.html) ou suivez quelques [cours] (https://egghead.io/courses/the-beginner-s-guide-to -réagir) +4. Familiarisez-vous avec les outils que vous utiliserez + 1. Gestionnaires de packages + - [npm] (https://www.npmjs.com/) + - [fil] (https://yarnpkg.com/lang/en/) + - [pnpm] (https://pnpm.js.org/) + 2. Exécuteurs de tâches + - [scripts npm] (https://docs.npmjs.com/misc/scripts) + - [gulp] (https://gulpjs.com/) + - [Webpack] (https://webpack.js.org/) + - [Rollup] (https://rollupjs.org/guide/en) + - [Colis] (https://parceljs.org/) +5. Stylisme + 1. Préprocesseur CSS + - [Sass / CSS] (https://sass-lang.com/) + - [PostCSS] (https://postcss.org/) + - [Moins] (http://lesscss.org/) + - [Stylet] (http://stylus-lang.com/) + 2. Cadres CSS + - [Bootstrap] (https://getbootstrap.com/) + - [Materialise] (https://materializecss.com/), [Material UI] (https://material-ui.com/), [Material Design Lite] (https://getmdl.io/) + - [Bulma] (https://bulma.io/) + - [Interface utilisateur sémantique] (https://semantic-ui.com/) + 3. Architecture CSS + - [BEM] (http://getbem.com/) + - [Modules CSS] (https://github.com/css-modules/css-modules) + - [Atomic] (https://acss.io/) + - [OOCSS] (https://github.com/stubbornella/oocss/wiki) + - [SMACSS] (https://smacss.com/) + - [SUITCSS] (https://suitcss.github.io/) + 4. CSS dans JS + - [Composants stylisés] (https://www.styled-components.com/) + - [Radium] (https://formidable.com/open-source/radium/) + - [Émotion] (https://emotion.sh/) + - [JSS] (http://cssinjs.org/) + - [Aphrodite] (https://github.com/Khan/aphrodite) +6. Gestion de l’État + 1. [État du composant] (https://reactjs.org/docs/faq-state.html) / [API de contexte] (https://reactjs.org/docs/context.html) + 2. [Redux] (https://redux.js.org/) + 1. Actions asynchrones (effets secondaires) + - [Redux Thunk] (https://github.com/reduxjs/redux-thunk) + - [Redux Better Promise] (https://github.com/Lukasz-pluszczewski/redux-better-promise) + - [Redux Saga] (https://redux-saga.js.org/) + - [Observable Redux] (https://redux-observable.js.org) + 2. Aides + - [Rematch] (https://rematch.gitbooks.io/rematch/) + - [Reselect] (https://github.com/reduxjs/reselect) + 3. Persistance des données + - [Redux Persist] (https://github.com/rt2zz/redux-persist) + - [Redux Phoenix] (https://github.com/adam-golab/redux-phoenix) + 4. [Formulaire Redux] (https://redux-form.com) + 3. [MobX] (https://mobx.js.org/) +7. Vérificateurs de type + - [PropTypes] (https://reactjs.org/docs/typechecking-with-proptypes.html) + - [TypeScript] (https://www.typescriptlang.org/) + - [Flow] (https://flow.org/en/) +8. Form Helpers + - [Formulaire Redux] (https://redux-form.com) + - [Formik] (https://github.com/jaredpalmer/formik) + - [Formsy] (https://github.com/formsy/fo diff --git a/translations/cn.json b/translations/cn.json index db5733c..d755c42 100644 --- a/translations/cn.json +++ b/translations/cn.json @@ -1,57 +1,57 @@ -{ - "React Developer in 2019": "2019 React 开发者", - "Legends": "图例", - "Personal must know": "必须掌握", - "Good to know": "最好掌握", - "Possibilities": "可以掌握", - "Learn the Basics": "学习基础知识", - "Learn the basics of HTML": "学习 HTML 的基础知识", - "Semantic HTML": "HTML 语法", - "Dividing page into sections and structuring the DOM properly": "将页面划分为多个部分并正确构建 DOM", - "Learn the basics of CSS": "学习 CSS 的基础知识", - "Grid and Flexbox": "Grid 布局和 Flexbox 布局", - "Responsive Web Design and Media Queries": "响应式 Web 设计和媒体查询", - "Syntax and basic operations": "语法和基本的操作", - "DOM manipulation": "DOM 操作", - "Hoisting, Event Bubbling, Prototyping": "变量提升，事件冒泡，原型", - "ECMA Script 6+, learn new features": "ECMA Script 6+, 学习新的特性", - "JS Basics": "JS 基础", - "jQuery (Optional)": "jQuery (可选)", - "General Development Skills": "常用开发技能", - "GIT - Version Control (GitHub, Bitbucket, GitLab)": "GIT - 版本控制 (GitHub, Bitbucket, GitLab)", - "HTTP/HTTPS protocol": "HTTP/HTTPS 协议", - "Learn to search for solutions": "学会寻找解决方案", - "Terminal usage": "终端的使用", - "Data Structures and Algorithms": "数据结构和算法", - "Design patterns": "设计模式", - "Build Tools": "构建工具", - "Package Managers": "包管理器", - "Task Runners": "任务运行器", - "npm scripts": "npm 脚本", - "Styling": "样式", - "CSS Preprocessors": "CSS 预处理器", - "CSS Frameworks": "CSS 框架", - "CSS Architecture": "CSS 架构", - "State Management": "状态管理", - "Component State / Context": "组件状态 / 上下文", - "Async actions": "异步操作", - "Form Helpers": "表单助手", - "Helpers": "助手", - "API Clients": "API 客户端", - "fetch (native)": "fetch (原生)", - "Utility Libraries": "实用工具库", - "i18n": "国际化(i18n)", - "Server Side Rendering": "服务器端渲染(SSR)", - "Backend Framework Integration": "后端集成框架", - "Desktop": "桌面端", - "Type Checkers": "类型检查器", - "Routing": "路由", - "Testing": "测试", - "Unit Testing": "单元(Unit)测试", - "Integration Testing": "集成测试", - "E2E Testing": "端到端(E2E)测试", - "Static Site Generator": "静态网站生成器", - "Mobile": "移动端", - "Virtual Reality": "虚拟现实(VR)", - "Keep Learning :)": "坚持学习 :)" -} +{ + "React Developer in 2019": "2019 React 开发者", + "Legends": "图例", + "Personal must know": "必须掌握", + "Good to know": "最好掌握", + "Possibilities": "可以掌握", + "Learn the Basics": "学习基础知识", + "Learn the basics of HTML": "学习 HTML 的基础知识", + "Semantic HTML": "HTML 语法", + "Dividing page into sections and structuring the DOM properly": "将页面划分为多个部分并正确构建 DOM", + "Learn the basics of CSS": "学习 CSS 的基础知识", + "Grid and Flexbox": "Grid 布局和 Flexbox 布局", + "Responsive Web Design and Media Queries": "响应式 Web 设计和媒体查询", + "Syntax and basic operations": "语法和基本的操作", + "DOM manipulation": "DOM 操作", + "Hoisting, Event Bubbling, Prototyping": "变量提升，事件冒泡，原型", + "ECMA Script 6+, learn new features": "ECMA Script 6+, 学习新的特性", + "JS Basics": "JS 基础", + "jQuery (Optional)": "jQuery (可选)", + "General Development Skills": "常用开发技能", + "GIT - Version Control (GitHub, Bitbucket, GitLab)": "GIT - 版本控制 (GitHub, Bitbucket, GitLab)", + "HTTP/HTTPS protocol": "HTTP/HTTPS 协议", + "Learn to search for solutions": "学会寻找解决方案", + "Terminal usage": "终端的使用", + "Data Structures and Algorithms": "数据结构和算法", + "Design patterns": "设计模式", + "Build Tools": "构建工具", + "Package Managers": "包管理器", + "Task Runners": "任务运行器", + "npm scripts": "npm 脚本", + "Styling": "样式", + "CSS Preprocessors": "CSS 预处理器", + "CSS Frameworks": "CSS 框架", + "CSS Architecture": "CSS 架构", + "State Management": "状态管理", + "Component State / Context": "组件状态 / 上下文", + "Async actions": "异步操作", + "Form Helpers": "表单助手", + "Helpers": "助手", + "API Clients": "API 客户端", + "fetch (native)": "fetch (原生)", + "Utility Libraries": "实用工具库", + "i18n": "国际化(i18n)", + "Server Side Rendering": "服务器端渲染(SSR)", + "Backend Framework Integration": "后端集成框架", + "Desktop": "桌面端", + "Type Checkers": "类型检查器", + "Routing": "路由", + "Testing": "测试", + "Unit Testing": "单元(Unit)测试", + "Integration Testing": "集成测试", + "E2E Testing": "端到端(E2E)测试", + "Static Site Generator": "静态网站生成器", + "Mobile": "移动端", + "Virtual Reality": "虚拟现实(VR)", + "Keep Learning :)": "坚持学习 :)" +} diff --git a/translations/es.json b/translations/es.json index c5dadc0..a20b434 100644 --- a/translations/es.json +++ b/translations/es.json @@ -1,57 +1,57 @@ -{ - "React Developer in 2019": "Desarrollador React en 2019", - "Legends": "Legendas", - "Personal must know": "Debe saber", - "Good to know": "Bueno saber", - "Possibilities": "Opcional", - "Learn the Basics": "Aprende lo básico", - "Learn the basics of HTML": "Aprende lo básico de HTML", - "Semantic HTML": "Semántica HTML", - "Dividing page into sections and structuring the DOM properly": "Dividir la página en secciones y estructurar el DOM correctamente", - "Learn the basics of CSS": "Aprende lo básico de CSS", - "Grid and Flexbox": "Grids y Flexbox", - "Responsive Web Design and Media Queries": "Diseño resposivo y Media Queries", - "Syntax and basic operations": "Sintaxis y operaciones básicas", - "DOM manipulation": "Manipulación del DOM", - "Hoisting, Event Bubbling, Prototyping": "Hoisting, Event Bubbling, Prototyping", - "ECMA Script 6+, learn new features": "Aprende las nuevas característica de ES6+", - "JS Basics": "Javascript básico", - "jQuery (Optional)": "jQuery (opcional)", - "General Development Skills": "Habilidades generales de desarrollo", - "GIT - Version Control (GitHub, Bitbucket, GitLab)": "GIT - Control de versiones (GitHub, Bitbucket, GitLab)", - "HTTP/HTTPS protocol": "Protocolo HTTP/HTTPS", - "Learn to search for solutions": "Aprende a buscar soluciones", - "Terminal usage": "Uso del terminal", - "Data Structures and Algorithms": "Estructura de datos y Algoritmos", - "Design patterns": "Patrones de diseño", - "Build Tools": "Herramientas de construcción", - "Package Managers": "Gestores de paquetes", - "Task Runners": "Corredores de tareas", - "npm scripts": "npm scripts", - "Styling": "Estilo", - "CSS Preprocessors": "Preprocesadores CSS", - "CSS Frameworks": "Frameworks CSS", - "CSS Architecture": "Arquitectura CSS", - "State Management": "Manejo del Estado", - "Component State / Context": "Estado del componente / Contexto", - "Async actions": "Acciones asincrónicas", - "Form Helpers": "Helpers de formulario", - "Helpers": "Helpers", - "API Clients": "API Clients", - "fetch (native)": "fetch (nativo)", - "Utility Libraries": "Bibliotecas útiles", - "i18n": "i18n", - "Server Side Rendering": "Renderizar del lado del servidor", - "Backend Framework Integration": "Framework de integración con el back-end", - "Desktop": "Escritorio", - "Type Checkers": "Type Checkers", - "Routing": "Enrutamiento", - "Testing": "Pruebas", - "Unit Testing": "Pruebas unitarias", - "Integration Testing": "Pruebas de integración", - "E2E Testing": "Pruebas end-to-end", - "Static Site Generator": "Generador de sitio estático", - "Mobile": "Móvil", - "Virtual Reality": "Realidad virtual", - "Keep Learning :)": "Continua aprendendo :)" +{ + "React Developer in 2019": "Desarrollador React en 2019", + "Legends": "Legendas", + "Personal must know": "Debe saber", + "Good to know": "Bueno saber", + "Possibilities": "Opcional", + "Learn the Basics": "Aprende lo básico", + "Learn the basics of HTML": "Aprende lo básico de HTML", + "Semantic HTML": "Semántica HTML", + "Dividing page into sections and structuring the DOM properly": "Dividir la página en secciones y estructurar el DOM correctamente", + "Learn the basics of CSS": "Aprende lo básico de CSS", + "Grid and Flexbox": "Grids y Flexbox", + "Responsive Web Design and Media Queries": "Diseño resposivo y Media Queries", + "Syntax and basic operations": "Sintaxis y operaciones básicas", + "DOM manipulation": "Manipulación del DOM", + "Hoisting, Event Bubbling, Prototyping": "Hoisting, Event Bubbling, Prototyping", + "ECMA Script 6+, learn new features": "Aprende las nuevas característica de ES6+", + "JS Basics": "Javascript básico", + "jQuery (Optional)": "jQuery (opcional)", + "General Development Skills": "Habilidades generales de desarrollo", + "GIT - Version Control (GitHub, Bitbucket, GitLab)": "GIT - Control de versiones (GitHub, Bitbucket, GitLab)", + "HTTP/HTTPS protocol": "Protocolo HTTP/HTTPS", + "Learn to search for solutions": "Aprende a buscar soluciones", + "Terminal usage": "Uso del terminal", + "Data Structures and Algorithms": "Estructura de datos y Algoritmos", + "Design patterns": "Patrones de diseño", + "Build Tools": "Herramientas de construcción", + "Package Managers": "Gestores de paquetes", + "Task Runners": "Corredores de tareas", + "npm scripts": "npm scripts", + "Styling": "Estilo", + "CSS Preprocessors": "Preprocesadores CSS", + "CSS Frameworks": "Frameworks CSS", + "CSS Architecture": "Arquitectura CSS", + "State Management": "Manejo del Estado", + "Component State / Context": "Estado del componente / Contexto", + "Async actions": "Acciones asincrónicas", + "Form Helpers": "Helpers de formulario", + "Helpers": "Helpers", + "API Clients": "API Clients", + "fetch (native)": "fetch (nativo)", + "Utility Libraries": "Bibliotecas útiles", + "i18n": "i18n", + "Server Side Rendering": "Renderizar del lado del servidor", + "Backend Framework Integration": "Framework de integración con el back-end", + "Desktop": "Escritorio", + "Type Checkers": "Type Checkers", + "Routing": "Enrutamiento", + "Testing": "Pruebas", + "Unit Testing": "Pruebas unitarias", + "Integration Testing": "Pruebas de integración", + "E2E Testing": "Pruebas end-to-end", + "Static Site Generator": "Generador de sitio estático", + "Mobile": "Móvil", + "Virtual Reality": "Realidad virtual", + "Keep Learning :)": "Continua aprendendo :)" } \ No newline at end of file diff --git a/translations/ja.json b/translations/ja.json index 7fb38a6..c1afaa2 100644 --- a/translations/ja.json +++ b/translations/ja.json @@ -1,52 +1,52 @@ -{ - "React Developer in 2019": "2019 React 開発者", - "Legends": "凡例", - "Personal must know": "必須", - "Good to know": "知るべき", - "Possibilities": "可能であれば", - "Learn the Basics": "基礎知識", - "Learn the basics of HTML": "HTMLの基礎知識", - "Semantic HTML": "Semantic HTML", - "Dividing page into sections and structuring the DOM properly": "ページコンテンツを適切なDOM要素で構成", - "Learn the basics of CSS": "CSSの基礎知識", - "Grid and Flexbox": "GridとFlexbox", - "Responsive Web Design and Media Queries": "レスポンシブWebデザインとメディアクエリ", - "Syntax and basic operations": "基礎的な文法", - "DOM manipulation": "DOM操作", - "Hoisting, Event Bubbling, Prototyping": "巻き上げ(Hoisting), イベントバブリング, Prototype", - "ECMA Script 6+, learn new features": "ECMA Script 6以降の新機能", - "JS Basics": "JS基礎", - "jQuery (Optional)": "jQuery (任意)", - "General Development Skills": "一般開発技能", - "GIT - Version Control (GitHub, Bitbucket, GitLab)": "GIT - バージョン管理 (GitHub, Bitbucket, GitLab)", - "HTTP/HTTPS protocol": "HTTP/HTTPS プロトコル", - "Learn to search for solutions": "問題解决能力", - "Terminal usage": "ターミナルの使い方", - "Data Structures and Algorithms": "データ構造とアルゴリズム", - "Design patterns": "デザインパターン", - "Build Tools": "ビルドツール", - "Package Managers": "パッケージマネージャ", - "Task Runners": "タスクランナー", - "CSS Preprocessors": "CSS プリプロセッサ", - "CSS Frameworks": "CSS フレームワーク", - "CSS Architecture": "CSS アーキテクチャ", - "State Management": "State管理", - "Async actions": "非同期処理", - "Form Helpers": "フォームヘルパー", - "Helpers": "ヘルパー", - "API Clients": "APIクライアント", - "fetch (native)": "fetch (native)", - "Utility Libraries": "Utility Libraries", - "i18n": "国際化(i18n)", - "Server Side Rendering": "サーバサイドレンダリング", - "Desktop": "Desktop", - "Type Checkers": "型チェッカー", - "Testing": "テスト", - "Unit Testing": "Unitテスト", - "Integration Testing": "結合テスト", - "E2E Testing": "E2Eテスト", - "Static Site Generator": "静的サイトジェネレータ", - "Mobile": "モバイル", - "Virtual Reality": "仮想現実(VR)", - "Keep Learning :)": "継続学習 ＼(^o^)／" -} +{ + "React Developer in 2019": "2019 React 開発者", + "Legends": "凡例", + "Personal must know": "必須", + "Good to know": "知るべき", + "Possibilities": "可能であれば", + "Learn the Basics": "基礎知識", + "Learn the basics of HTML": "HTMLの基礎知識", + "Semantic HTML": "Semantic HTML", + "Dividing page into sections and structuring the DOM properly": "ページコンテンツを適切なDOM要素で構成", + "Learn the basics of CSS": "CSSの基礎知識", + "Grid and Flexbox": "GridとFlexbox", + "Responsive Web Design and Media Queries": "レスポンシブWebデザインとメディアクエリ", + "Syntax and basic operations": "基礎的な文法", + "DOM manipulation": "DOM操作", + "Hoisting, Event Bubbling, Prototyping": "巻き上げ(Hoisting), イベントバブリング, Prototype", + "ECMA Script 6+, learn new features": "ECMA Script 6以降の新機能", + "JS Basics": "JS基礎", + "jQuery (Optional)": "jQuery (任意)", + "General Development Skills": "一般開発技能", + "GIT - Version Control (GitHub, Bitbucket, GitLab)": "GIT - バージョン管理 (GitHub, Bitbucket, GitLab)", + "HTTP/HTTPS protocol": "HTTP/HTTPS プロトコル", + "Learn to search for solutions": "問題解决能力", + "Terminal usage": "ターミナルの使い方", + "Data Structures and Algorithms": "データ構造とアルゴリズム", + "Design patterns": "デザインパターン", + "Build Tools": "ビルドツール", + "Package Managers": "パッケージマネージャ", + "Task Runners": "タスクランナー", + "CSS Preprocessors": "CSS プリプロセッサ", + "CSS Frameworks": "CSS フレームワーク", + "CSS Architecture": "CSS アーキテクチャ", + "State Management": "State管理", + "Async actions": "非同期処理", + "Form Helpers": "フォームヘルパー", + "Helpers": "ヘルパー", + "API Clients": "APIクライアント", + "fetch (native)": "fetch (native)", + "Utility Libraries": "Utility Libraries", + "i18n": "国際化(i18n)", + "Server Side Rendering": "サーバサイドレンダリング", + "Desktop": "Desktop", + "Type Checkers": "型チェッカー", + "Testing": "テスト", + "Unit Testing": "Unitテスト", + "Integration Testing": "結合テスト", + "E2E Testing": "E2Eテスト", + "Static Site Generator": "静的サイトジェネレータ", + "Mobile": "モバイル", + "Virtual Reality": "仮想現実(VR)", + "Keep Learning :)": "継続学習 ＼(^o^)／" +} diff --git a/translations/ko.json b/translations/ko.json index e11f200..f08087e 100644 --- a/translations/ko.json +++ b/translations/ko.json @@ -1,58 +1,58 @@ -{ - "React Developer in 2019": "2019년 React 개발자", - "Legends": "중요도", - "Personal must know": "(주관적이지만) 꼭 배우세요", - "Good to know": "배우면 좋습니다", - "Possibilities": "배워야 할수도", - "Learn the Basics": "기본기 다지기", - "Learn the basics of HTML": "HTML 기분 문법 및 사용법", - "Semantic HTML": "시멘틱(Semantic) HTML", - "Dividing page into sections and structuring the DOM properly": "페이지를 나누고 DOM을 올바르게 설계하기", - "Learn the basics of CSS": "CSS 기본 문법 및 사용법", - "Grid and Flexbox": "Grid와 Flexbox를 활용한 레이아웃", - "Responsive Web Design and Media Queries": "반응형 웹 디자인과 미디어 쿼리 사용법", - "Syntax and basic operations": "기본적인 문법과 코드 작성법", - "DOM manipulation": "DOM 조작", - "Hoisting, Event Bubbling, Prototyping": "호이스팅(Hoisting), 이벤트 버블링, 프로토타입", - "ECMA Script 6+, learn new features": "ECMA Script 6+, 새로 추가된 기능 배우기", - "JS Basics": "JS 기본기", - "jQuery (Optional)": "jQuery(선택)", - "General Development Skills": "기본적인 개발 스킬", - "GIT - Version Control (GitHub, Bitbucket, GitLab)": "GIT - 버전관리(Github, Bitbucket, Gitlab)", - "HTTP/HTTPS protocol": "HTTP/HTTPS 프로토콜", - "Learn to search for solutions": "문제해결을 위한 검색", - "Terminal usage": "터미널 사용법", - "Data Structures and Algorithms": "자료구조 / 알고리즘", - "Design patterns": "디자인 패턴", - "Build Tools": "빌드 도구", - "Package Managers": "패키지 관리", - "Task Runners": "태스크 러너", - "npm scripts": "npm scripts", - "Styling": "스타일링", - "CSS Preprocessors": "CSS 전처리기", - "CSS Frameworks": "CSS 프레임워크", - "CSS Architecture": "CSS 설계", - "CSS in JS": "CSS in JS", - "State Management": "상태관리", - "Component State / Context": "컴포넌트 상태관리 / Context", - "Async actions": "비동기 액션", - "Form Helpers": "폼(Form) 헬퍼", - "Helpers": "헬퍼 라이브러리", - "API Clients": "API 클라이언트", - "fetch (native)": "fetch(내장)", - "Utility Libraries": "유틸리티 라이브러리", - "i18n": "국제화(i18n)", - "Server Side Rendering": "서버 사이드 렌더링", - "Backend Framework Integration": "백엔드 프레임워크 통합", - "Desktop": "데스크탑", - "Type Checkers": "정적 타입 체킹", - "Routing": "라우팅", - "Testing": "테스팅", - "Unit Testing": "유닛 테스팅", - "Integration Testing": "통합 테스팅", - "E2E Testing": "E2E 테스팅", - "Static Site Generator": "정적 사이트 생성기", - "Mobile": "모바일", - "Virtual Reality": "가상현실(VR)", - "Keep Learning :)": "계속 배우세요 :)" -} +{ + "React Developer in 2019": "2019년 React 개발자", + "Legends": "중요도", + "Personal must know": "(주관적이지만) 꼭 배우세요", + "Good to know": "배우면 좋습니다", + "Possibilities": "배워야 할수도", + "Learn the Basics": "기본기 다지기", + "Learn the basics of HTML": "HTML 기분 문법 및 사용법", + "Semantic HTML": "시멘틱(Semantic) HTML", + "Dividing page into sections and structuring the DOM properly": "페이지를 나누고 DOM을 올바르게 설계하기", + "Learn the basics of CSS": "CSS 기본 문법 및 사용법", + "Grid and Flexbox": "Grid와 Flexbox를 활용한 레이아웃", + "Responsive Web Design and Media Queries": "반응형 웹 디자인과 미디어 쿼리 사용법", + "Syntax and basic operations": "기본적인 문법과 코드 작성법", + "DOM manipulation": "DOM 조작", + "Hoisting, Event Bubbling, Prototyping": "호이스팅(Hoisting), 이벤트 버블링, 프로토타입", + "ECMA Script 6+, learn new features": "ECMA Script 6+, 새로 추가된 기능 배우기", + "JS Basics": "JS 기본기", + "jQuery (Optional)": "jQuery(선택)", + "General Development Skills": "기본적인 개발 스킬", + "GIT - Version Control (GitHub, Bitbucket, GitLab)": "GIT - 버전관리(Github, Bitbucket, Gitlab)", + "HTTP/HTTPS protocol": "HTTP/HTTPS 프로토콜", + "Learn to search for solutions": "문제해결을 위한 검색", + "Terminal usage": "터미널 사용법", + "Data Structures and Algorithms": "자료구조 / 알고리즘", + "Design patterns": "디자인 패턴", + "Build Tools": "빌드 도구", + "Package Managers": "패키지 관리", + "Task Runners": "태스크 러너", + "npm scripts": "npm scripts", + "Styling": "스타일링", + "CSS Preprocessors": "CSS 전처리기", + "CSS Frameworks": "CSS 프레임워크", + "CSS Architecture": "CSS 설계", + "CSS in JS": "CSS in JS", + "State Management": "상태관리", + "Component State / Context": "컴포넌트 상태관리 / Context", + "Async actions": "비동기 액션", + "Form Helpers": "폼(Form) 헬퍼", + "Helpers": "헬퍼 라이브러리", + "API Clients": "API 클라이언트", + "fetch (native)": "fetch(내장)", + "Utility Libraries": "유틸리티 라이브러리", + "i18n": "국제화(i18n)", + "Server Side Rendering": "서버 사이드 렌더링", + "Backend Framework Integration": "백엔드 프레임워크 통합", + "Desktop": "데스크탑", + "Type Checkers": "정적 타입 체킹", + "Routing": "라우팅", + "Testing": "테스팅", + "Unit Testing": "유닛 테스팅", + "Integration Testing": "통합 테스팅", + "E2E Testing": "E2E 테스팅", + "Static Site Generator": "정적 사이트 생성기", + "Mobile": "모바일", + "Virtual Reality": "가상현실(VR)", + "Keep Learning :)": "계속 배우세요 :)" +} diff --git a/translations/pt-br.json b/translations/pt-br.json index 66dfc48..b46fe75 100644 --- a/translations/pt-br.json +++ b/translations/pt-br.json @@ -1,57 +1,57 @@ -{ - "React Developer in 2019": "Desenvolvedor React em 2019", - "Legends": "Legendas", - "Personal must know": "Deve saber", - "Good to know": "Bom saber", - "Possibilities": "Opcional", - "Learn the Basics": "Aprenda o básico", - "Learn the basics of HTML": "Aprenda o básico de HTML", - "Semantic HTML": "Semântica HTML", - "Dividing page into sections and structuring the DOM properly": "Divida a página em sections e estruture o DOM adequadamente", - "Learn the basics of CSS": "Aprenda o básico de CSS", - "Grid and Flexbox": "Grids e Flexbox", - "Responsive Web Design and Media Queries": "Design resposivo e Media Queries", - "Syntax and basic operations": "Sintaxe e operações básicas", - "DOM manipulation": "Manipulação do DOM", - "Hoisting, Event Bubbling, Prototyping": "Hoisting, Event Bubbling, Prototyping", - "ECMA Script 6+, learn new features": "Aprenda as novas features do ES6+", - "JS Basics": "Javascript básico", - "jQuery (Optional)": "jQuery (opcional)", - "General Development Skills": "Conhecimentos de desenvolvimento em geral", - "GIT - Version Control (GitHub, Bitbucket, GitLab)": "GIT - Controle de versionamento (GitHub, Bitbucket, GitLab)", - "HTTP/HTTPS protocol": "Protocolo HTTP/HTTPS", - "Learn to search for solutions": "Aprenda procurar por soluções", - "Terminal usage": "Utilização de terminal", - "Data Structures and Algorithms": "Estrutura de dados e Algoritmos", - "Design patterns": "Design Patterns", - "Build Tools": "Ferramentas de build", - "Package Managers": "Gerenciadores de pacote", - "Task Runners": "Executadores de tarefas", - "npm scripts": "npm scripts", - "Styling": "Estilização", - "CSS Preprocessors": "Pré-processadores CSS", - "CSS Frameworks": "Frameworks CSS", - "CSS Architecture": "Arquitetura CSS", - "State Management": "Gerenciamento de estado", - "Component State / Context": "Component State / Context", - "Async actions": "Async actions", - "Form Helpers": "Form Helpers", - "Helpers": "Helpers", - "API Clients": "API Clients", - "fetch (native)": "fetch (nativo)", - "Utility Libraries": "Bibliotecas úteis", - "i18n": "i18n", - "Server Side Rendering": "Renderização no servidor", - "Backend Framework Integration": "Framework de integração com back-end", - "Desktop": "Desktop", - "Type Checkers": "Tipagem", - "Routing": "Rotas", - "Testing": "Testes", - "Unit Testing": "Teste unitário", - "Integration Testing": "Teste de integração", - "E2E Testing": "Teste end-to-end", - "Static Site Generator": "Gerador de site estático", - "Mobile": "Mobile", - "Virtual Reality": "Realidade virtual", - "Keep Learning :)": "Continue aprendendo :)" +{ + "React Developer in 2019": "Desenvolvedor React em 2019", + "Legends": "Legendas", + "Personal must know": "Deve saber", + "Good to know": "Bom saber", + "Possibilities": "Opcional", + "Learn the Basics": "Aprenda o básico", + "Learn the basics of HTML": "Aprenda o básico de HTML", + "Semantic HTML": "Semântica HTML", + "Dividing page into sections and structuring the DOM properly": "Divida a página em sections e estruture o DOM adequadamente", + "Learn the basics of CSS": "Aprenda o básico de CSS", + "Grid and Flexbox": "Grids e Flexbox", + "Responsive Web Design and Media Queries": "Design resposivo e Media Queries", + "Syntax and basic operations": "Sintaxe e operações básicas", + "DOM manipulation": "Manipulação do DOM", + "Hoisting, Event Bubbling, Prototyping": "Hoisting, Event Bubbling, Prototyping", + "ECMA Script 6+, learn new features": "Aprenda as novas features do ES6+", + "JS Basics": "Javascript básico", + "jQuery (Optional)": "jQuery (opcional)", + "General Development Skills": "Conhecimentos de desenvolvimento em geral", + "GIT - Version Control (GitHub, Bitbucket, GitLab)": "GIT - Controle de versionamento (GitHub, Bitbucket, GitLab)", + "HTTP/HTTPS protocol": "Protocolo HTTP/HTTPS", + "Learn to search for solutions": "Aprenda procurar por soluções", + "Terminal usage": "Utilização de terminal", + "Data Structures and Algorithms": "Estrutura de dados e Algoritmos", + "Design patterns": "Design Patterns", + "Build Tools": "Ferramentas de build", + "Package Managers": "Gerenciadores de pacote", + "Task Runners": "Executadores de tarefas", + "npm scripts": "npm scripts", + "Styling": "Estilização", + "CSS Preprocessors": "Pré-processadores CSS", + "CSS Frameworks": "Frameworks CSS", + "CSS Architecture": "Arquitetura CSS", + "State Management": "Gerenciamento de estado", + "Component State / Context": "Component State / Context", + "Async actions": "Async actions", + "Form Helpers": "Form Helpers", + "Helpers": "Helpers", + "API Clients": "API Clients", + "fetch (native)": "fetch (nativo)", + "Utility Libraries": "Bibliotecas úteis", + "i18n": "i18n", + "Server Side Rendering": "Renderização no servidor", + "Backend Framework Integration": "Framework de integração com back-end", + "Desktop": "Desktop", + "Type Checkers": "Tipagem", + "Routing": "Rotas", + "Testing": "Testes", + "Unit Testing": "Teste unitário", + "Integration Testing": "Teste de integração", + "E2E Testing": "Teste end-to-end", + "Static Site Generator": "Gerador de site estático", + "Mobile": "Mobile", + "Virtual Reality": "Realidade virtual", + "Keep Learning :)": "Continue aprendendo :)" } \ No newline at end of file diff --git a/translations/ru.json b/translations/ru.json index 6626742..9d87b24 100644 --- a/translations/ru.json +++ b/translations/ru.json @@ -1,58 +1,58 @@ -{ - "React Developer in 2019": "React-разработчик в 2019 году", - "Legends": "Обозначения", - "Personal must know": "Обязательно для изучения", - "Good to know": "Полезно знать", - "Possibilities": "Вариант на будущее", - "Learn the Basics": "Изучение основ", - "Learn the basics of HTML": "Изучить основы HTML", - "Semantic HTML": "Семантический HTML", - "Dividing page into sections and structuring the DOM properly": "Разделение страницы на разделы и правильное структурирование DOM", - "Learn the basics of CSS": "Изучить основы CSS", - "Grid and Flexbox": "Гриды и флексбоксы", - "Responsive Web Design and Media Queries": "Адаптивный веб-дизайн и медиавыражения", - "Syntax and basic operations": "Синтаксис и основные операции", - "DOM manipulation": "Манипуляция с DOM", - "Hoisting, Event Bubbling, Prototyping": "Поднятие, всплытие событий, прототипы", - "ECMA Script 6+, learn new features": "ECMAScript 6+, изучить новые возможности", - "JS Basics": "Основы JS", - "jQuery (Optional)": "jQuery (необязательно)", - "General Development Skills": "Общие навыки для разработки", - "GIT - Version Control (GitHub, Bitbucket, GitLab)": "Git — система управление версиями (GitHub, Bitbucket, GitLab)", - "HTTP/HTTPS protocol": "Протокол HTTP/HTTPS", - "Learn to search for solutions": "Научиться искать решения", - "Terminal usage": "Использование терминала", - "Data Structures and Algorithms": "Структуры данных и алгоритмы", - "Design patterns": "Паттерны проектирования", - "Build Tools": "Инструменты сборки", - "Package Managers": "Менеджеры пакетов", - "Task Runners": "Выполнение задач", - "npm scripts": "npm-скрипты", - "Styling": "Стилизация", - "CSS Preprocessors": "CSS-препроцессоры", - "CSS Frameworks": "CSS-фреймворки", - "CSS Architecture": "Архитектура CSS", - "CSS in JS": "CSS в JS", - "State Management": "Управление состоянием", - "Component State / Context": "Состояние компонента / Контекст", - "Async actions": "Асинхронные действия", - "Form Helpers": "Вспомогательные библиотеки для форм", - "Helpers": "Библиотеки-помощники", - "API Clients": "API-клиенты", - "fetch (native)": "fetch (нативный)", - "Utility Libraries": "Утилитарные библиотеки", - "i18n": "Локализация", - "Server Side Rendering": "Отрисовка на стороне сервера", - "Backend Framework Integration": "Интеграция с бэкенд-фреймворками", - "Desktop": "Разработка десктопных приложений", - "Type Checkers": "Проверка типов", - "Routing": "Маршрутизация", - "Testing": "Тестирование", - "Unit Testing": "Модульное тестирование", - "Integration Testing": "Интеграционное тестирование", - "E2E Testing": "Сквозное (end-to-end) тестирование", - "Static Site Generator": "Генератор статических сайтов", - "Mobile": "Разработка мобильных приложений", - "Virtual Reality": "Виртуальная реальность", - "Keep Learning :)": "Продолжать учиться :)" -} +{ + "React Developer in 2019": "React-разработчик в 2019 году", + "Legends": "Обозначения", + "Personal must know": "Обязательно для изучения", + "Good to know": "Полезно знать", + "Possibilities": "Вариант на будущее", + "Learn the Basics": "Изучение основ", + "Learn the basics of HTML": "Изучить основы HTML", + "Semantic HTML": "Семантический HTML", + "Dividing page into sections and structuring the DOM properly": "Разделение страницы на разделы и правильное структурирование DOM", + "Learn the basics of CSS": "Изучить основы CSS", + "Grid and Flexbox": "Гриды и флексбоксы", + "Responsive Web Design and Media Queries": "Адаптивный веб-дизайн и медиавыражения", + "Syntax and basic operations": "Синтаксис и основные операции", + "DOM manipulation": "Манипуляция с DOM", + "Hoisting, Event Bubbling, Prototyping": "Поднятие, всплытие событий, прототипы", + "ECMA Script 6+, learn new features": "ECMAScript 6+, изучить новые возможности", + "JS Basics": "Основы JS", + "jQuery (Optional)": "jQuery (необязательно)", + "General Development Skills": "Общие навыки для разработки", + "GIT - Version Control (GitHub, Bitbucket, GitLab)": "Git — система управление версиями (GitHub, Bitbucket, GitLab)", + "HTTP/HTTPS protocol": "Протокол HTTP/HTTPS", + "Learn to search for solutions": "Научиться искать решения", + "Terminal usage": "Использование терминала", + "Data Structures and Algorithms": "Структуры данных и алгоритмы", + "Design patterns": "Паттерны проектирования", + "Build Tools": "Инструменты сборки", + "Package Managers": "Менеджеры пакетов", + "Task Runners": "Выполнение задач", + "npm scripts": "npm-скрипты", + "Styling": "Стилизация", + "CSS Preprocessors": "CSS-препроцессоры", + "CSS Frameworks": "CSS-фреймворки", + "CSS Architecture": "Архитектура CSS", + "CSS in JS": "CSS в JS", + "State Management": "Управление состоянием", + "Component State / Context": "Состояние компонента / Контекст", + "Async actions": "Асинхронные действия", + "Form Helpers": "Вспомогательные библиотеки для форм", + "Helpers": "Библиотеки-помощники", + "API Clients": "API-клиенты", + "fetch (native)": "fetch (нативный)", + "Utility Libraries": "Утилитарные библиотеки", + "i18n": "Локализация", + "Server Side Rendering": "Отрисовка на стороне сервера", + "Backend Framework Integration": "Интеграция с бэкенд-фреймворками", + "Desktop": "Разработка десктопных приложений", + "Type Checkers": "Проверка типов", + "Routing": "Маршрутизация", + "Testing": "Тестирование", + "Unit Testing": "Модульное тестирование", + "Integration Testing": "Интеграционное тестирование", + "E2E Testing": "Сквозное (end-to-end) тестирование", + "Static Site Generator": "Генератор статических сайтов", + "Mobile": "Разработка мобильных приложений", + "Virtual Reality": "Виртуальная реальность", + "Keep Learning :)": "Продолжать учиться :)" +} diff --git a/translations/translate.js b/translations/translate.js index aef231b..2ef01f5 100644 --- a/translations/translate.js +++ b/translations/translate.js @@ -1,43 +1,43 @@ -const { readFile, writeFile, existsSync } = require('fs'); -const { join } = require('path'); - -if (!process.argv[2]) { - console.error('Please provide language for translation') - console.log('Usage: node ./translate.js lang') - console.log('Example: node ./translate.js cn'); - process.exit(1); -} - -const lang = process.argv[2].toLowerCase(); - -if (!existsSync(join(__dirname, `./${lang}.json`))) { - console.error('Make sure that file with translation exists') - process.exit(1); -} - -function escapeRegExp(str) { - return str.replace(/[\-\[\]\/\{\}\(\)\*\+\?\.\\\^\$\|]/g, "\\$&"); -} - -readFile(join(__dirname, '../src/react-developer-roadmap.xml'), 'utf-8', (error, xmlData) => { - if (!error) { - readFile(join(__dirname, `./${lang}.json`), 'utf-8', (error, translationsFile) => { - if (!error) { - const translations = JSON.parse(translationsFile); - - let translatedXML = xmlData; - Object.keys(translations).forEach(key => - translatedXML = translatedXML.replace( - new RegExp(escapeRegExp(`value=\"${key}\"`), 'g'), - `value="${translations[key]}"` - ) - ); - writeFile(join(__dirname, `../src/react-developer-roadmap-${lang}.xml`), translatedXML, 'utf-8', error => { - if (!error) { - console.log(`Translated to ${lang}`); - } - }); - } - }); - } -}); +const { readFile, writeFile, existsSync } = require('fs'); +const { join } = require('path'); + +if (!process.argv[2]) { + console.error('Please provide language for translation') + console.log('Usage: node ./translate.js lang') + console.log('Example: node ./translate.js cn'); + process.exit(1); +} + +const lang = process.argv[2].toLowerCase(); + +if (!existsSync(join(__dirname, `./${lang}.json`))) { + console.error('Make sure that file with translation exists') + process.exit(1); +} + +function escapeRegExp(str) { + return str.replace(/[\-\[\]\/\{\}\(\)\*\+\?\.\\\^\$\|]/g, "\\$&"); +} + +readFile(join(__dirname, '../src/react-developer-roadmap.xml'), 'utf-8', (error, xmlData) => { + if (!error) { + readFile(join(__dirname, `./${lang}.json`), 'utf-8', (error, translationsFile) => { + if (!error) { + const translations = JSON.parse(translationsFile); + + let translatedXML = xmlData; + Object.keys(translations).forEach(key => + translatedXML = translatedXML.replace( + new RegExp(escapeRegExp(`value=\"${key}\"`), 'g'), + `value="${translations[key]}"` + ) + ); + writeFile(join(__dirname, `../src/react-developer-roadmap-${lang}.xml`), translatedXML, 'utf-8', error => { + if (!error) { + console.log(`Translated to ${lang}`); + } + }); + } + }); + } +});