BundlePhobia


BundlePhobia is used to analyze NPM package dependencies, post-bundle sizes, download speed estimates, etc., to help you understand the cost of introducing a package before referencing it:



You can also upload a package.json file for your project, BundlePhobia will help you evaluate the size and loading speed of all the packages in your project:



2. CloudCraft

If you use AWS, CloudCraft will help you a lot. CloudCraft provides a visual interface to design your cloud service architecture by drag and drop



CloudCraft provides statistics on cloud service prices to help you budget carefully



3. Figma

Figma is one of the more famous names on this list, and is definitely worth a try for designers who are used to Illustrator and Sketch. Figma offers both Web and Desktop versions. The Web version is written using WebAssembly to achieve the same performance as the Desktop, so it can be used quickly on different operating systems. Figma can simulate a variety of user input events and can export designs directly to CSS, IOS and Android styles.



4. Fontflipper

If you’re struggling with fonts during design or development, try Fontflipper. Fontflipper’s only purpose is to let you choose the font that best fits your design, upload your design, add your text, switch between different fonts, bookmark your favorites, and that’s it. The e disadvantage is that there is no Chinese font.



5. VisBug

VisBug is a plugin for Google Chrome that came out a while ago. VisBug lets you check elements, move elements, change CSS properties, and find elements faster. Greatly increase front-end development efficiency!




6. Insomnia

Insomnia is a debugging API tool that supports debugging Rest apis and GraphQL APIS. There are good intelligence hints when writing graphQL Query.



7. Flare

Flare is used to design 2D dynamic diagrams with a similar experience to Figma.



Like Codepen, you can also see the public work of other designers



Finally, I wish you all a happy life and work!

Communication: In the process of learning the web front end, I often don’t want to learn because there is no information or no one’s guidance, so I specially prepared a group 545667817, organized a most comprehensive front end learning materials, from the most basic HTML+CSS+JS to mobile HTML5 project actual combat learning materials are organized. Those who want to learn can apply for joining and send it to every front-end partner. Those who want to learn web front-end, change industries, or college students, and those who want to improve their abilities in work are welcome to join the learning.