Frontend Mentor的封面图片
Frontend Mentor

Frontend Mentor

在线学习提供商

Improve your coding skills by building realistic projects.

关于我们

For developers: Our professionally designed challenges help you gain hands-on experience writing HTML, CSS, and JavaScript. We create the designs so you can focus on the code and see your skills skyrocket! For companies: Our hiring platform helps companies connect with exceptional talent from the Frontend Mentor community. We help you save money and time while hiring the best developers who meet your hiring needs.

网站
https://www.frontendmentor.io
所属行业
在线学习提供商
规模
2-10 人
类型
私人持股
创立
2018
领域
frontend、web development和coding

Frontend Mentor员工

动态

  • 查看Frontend Mentor的组织主页

    33,343 位关注者

    There's always so much to learn by watching how experienced developers tackle real-world problems. Check out David's walkthrough of our QR Code Component project to see how he would approach it while keeping best practices top-of-mind ??

    查看David Cross的档案

    ?????? UI & Front-end Developer/Lead (15+ yrs) || HTML, (S)CSS, Vanilla JS, Web Components, React, Vite, and more.

    Getting back to building UI, I've started taking on some challenges from Frontend Mentor. Starting right at the beginning, we explore the "card" pattern, which I believe is used _almost everywhere_ in modern web development and design. Take a look, and let me know what you think.

  • 查看Frontend Mentor的组织主页

    33,343 位关注者

    We've just launched a new PREMIUM challenge! ?? This personal blog site will be a fun project to build. There are five pages in total: Home, Blog Index, Blog Show, About, and Newsletter. The articles are in a JSON file for anyone who wants to practice populating the articles dynamically. You could even take the project up a notch and use it to practice working with a headless CMS! Your users should be able to: ?? Navigate to all pages by clicking links or using their keyboard ?? Read all articles ?? Select their color theme ?? Submit their email to subscribe to the newsletter ?? Receive an error message when the newsletter form is submitted incorrectly ?? Receive a success message if submitted correctly ?? View the optimal layout for the interface depending on their device's screen size ?? See hover and focus states for all interactive elements on the page If you're looking to start a blog, this could be the perfect project to take forward yourself and make your own! ?? We hope you enjoy building the project! For more details, check out the challenge page below ?? https://lnkd.in/eSkvTeub

  • 查看Frontend Mentor的组织主页

    33,343 位关注者

    We've got a new PREMIUM challenge launching tomorrow, so here's a sneak preview! ?? This personal blog site will be fun to build. It has five pages: Home, Blog Index, Blog Show, About, and Newsletter. The articles are in a JSON file for anyone who wants to practice populating them dynamically. If you want to push yourself, you could use it to practice working with a headless CMS. You can even take it forward as your own personal blog after creating it! ??

    • Desktop design preview of Frontend Mentor's upcoming personal blog coding challenge
    • Desktop design preview of Frontend Mentor's upcoming personal blog coding challenge blog post page
    • Tablet design preview of Frontend Mentor's upcoming personal blog coding challenge
    • Mobile design preview of Frontend Mentor's upcoming personal blog coding challenge
  • 查看Frontend Mentor的组织主页

    33,343 位关注者

    We've just launched a new PREMIUM challenge! ?? This character counter will test a range of your skills, especially your JavaScript, with the counters and letter density graph. The theme switcher is another little challenge. Your users should be able to: ?? Analyze the character, word, and sentence counts for their text ?? Exclude/Include spaces in their character count ?? Set a character limit ?? Receive a warning message if their text exceeds their character limit ?? See the approximate reading time of their text ?? Analyze the letter density of their text ?? Select their color theme ?? Navigate the app and perform all actions using only their keyboard ?? View the optimal layout for the interface depending on their device's screen size ?? See hover and focus states for all interactive elements on the page There are plenty of ways to extend the project as well, like adding more counters (e.g., lines, spaces, etc.) and adding a word density graph along with the letter density graph. These are perfect extras to customize the project and make it your own! ? Heads up that this is a premium challenge, so you'll need a pro subscription. Our premium challenges are our highest-quality projects and make incredible portfolio pieces. Happy coding! ??

    • Desktop layout design preview of Frontend Mentor's character counter coding challenge.
    • Tablet layout design preview of Frontend Mentor's character counter coding challenge.
    • Mobile layout design preview of Frontend Mentor's character counter coding challenge.
  • 查看Frontend Mentor的组织主页

    33,343 位关注者

    We've updated our Teams platform to improve all our marketing pages and add use cases! ? Our Teams platform helps companies and schools train and onboard developers faster through project-based learning. Here are the updates... ?? Homepage We've made updates to improve how we communicate the platform's benefits. Main takeaway: Our real-world projects help developers gain hands-on project experience so they become productive faster. https://lnkd.in/eJ3pYVpb ? Why Us We dive deeper into the benefits of using our industry-standard practice projects to help your team gain real-world skills. You can even promote your brand through your team members! https://lnkd.in/ebKu8P_P ?? Use Case - Companies Accelerate developer onboarding and skill growth. Our platform makes it simple to bring new hires up to speed and strengthen the whole team’s expertise through hands-on projects. https://lnkd.in/eKAZCFP2 ???? Use Case - Coding Schools (and regular schools) Enhance your coding curriculum with industry-standard projects. Help your students develop real-world coding skills through hands-on projects and support from a global community. https://lnkd.in/ecR2sxuf ???? Use Case - Internship Programs Give your interns real-world coding experience and help your interns learn by doing. Our projects help them build their skills outside a production environment. https://lnkd.in/e7cfBQ-m ??? Use Case - Apprenticeship Programs Help your apprentices build practical coding skills and become productive sooner. Our hands-on projects help apprentices learn faster by building realistic projects. https://lnkd.in/e2gC43dP That's it! If you want to see how real-world projects can help train your developers, onboard new hires/interns/apprentices faster, and close skill gaps, please check out our Teams platform ??

    • 该图片无替代文字
  • 查看Frontend Mentor的组织主页

    33,343 位关注者

    We've got a new PREMIUM challenge launching tomorrow, so here's a sneak preview! ?? This character counter will test a range of your skills, especially your JavaScript, with the counters and letter density graph. The theme switcher is another little challenge. It should be a fun one! ??

    • Desktop layout design preview of Frontend Mentor's upcoming character counter coding challenge.
    • Tablet layout design preview of Frontend Mentor's upcoming character counter coding challenge.
    • Mobile layout design preview of Frontend Mentor's upcoming character counter coding challenge.
  • 查看Frontend Mentor的组织主页

    33,343 位关注者

    It's great to see Airbnb's Connect Engineering Apprenticeship opening applications on February 10th! ?? This apprenticeship is specifically aimed at self-taught developers and bootcamp grads. Candidates from underrepresented backgrounds and unconventional paths are encouraged to apply. This program is US-only and lasts 6 months. It's an excellent opportunity for developers without a degree or professional experience! ?? Good luck to anyone who applies! ?? Link in the comments ??

    • 该图片无替代文字
  • 查看Frontend Mentor的组织主页

    33,343 位关注者

    We've just launched our FREE "Getting job ready" learning path! ?? We know the job market for entry-level developers is challenging right now. With this path, we aim to help you stand out and make a strong impression on potential employers. Here's what's included: 1?? Preparing yourself for success We outline what to expect throughout this path and offer some tips to help increase your chances of completing it and getting hired. 2?? Optimizing your GitHub profile Your GitHub profile is among the first links many employers want to see. This article provides tips to ensure your profile presents you in the best light. 3?? Creating an effective portfolio An eye-catching portfolio site can make a lasting impression. In this step, we outline what makes an effective portfolio site. 4?? Preparing your job application materials Well-written, tailored resumes and cover letters can go a long way to getting your foot in the door. In this article, we provide some tips to help you stand out. 5?? Creating and maintaining professional profiles A strong LinkedIn profile can open up opportunities and help you expand your network. In this article, we outline how to do this and how to set up your Talent Profile on Frontend Mentor. 6?? Building your online presence Building an online presence can increase your chances of creating opportunities. In this article, we provide advice about learning in public and building your online presence. 7?? How to find web development opportunities Knowing where to find relevant opportunities is a critical part of the job-hunting process. This step outlines strategies and resources to help you find opportunities. 8?? Essential soft skills for developers Showcasing soft skills in interviews can help you stand out. This article outlines the most essential skills and ideas for demonstrating them. 9?? Preparing for technical interviews Preparing for technical interviews is a crucial step in the job-hunting process. This step outlines what to expect and how to prepare so you can be as confident as possible. 1??0?? Understanding workplace dynamics Understanding workplace dynamics before starting your first role can put you in a strong position. This article provides a quick overview and insights into life as a professional. 1??1?? Professional development workflows Demonstrating an understanding of professional development workflows is another way to stand out during the interview process. This article outlines common professional workflow concepts. 1??2?? Ongoing professional development The learning doesn't stop once you become a professional! This article outlines ideas for staying updated, keeping your skills fresh, and embracing your career with a growth mindset. Job hunting can be a daunting and challenging process. Hopefully, by the end of this path, you'll better understand everything you need to succeed in the job market. We wish you all the best and are excited to celebrate your wins with you! ??

    • 该图片无替代文字
  • 查看Frontend Mentor的组织主页

    33,343 位关注者

    We've just shipped team branding! ? This means teams can now promote their company, careers page, course, school, or any page they like throughout the Frontend Mentor community! ?? If team branding is enabled, your brand will appear wherever your team members do. Your brand will gain exposure as team members submit more solutions, write more code reviews, and engage on the Frontend Mentor platform. To check out team branding, create a team account on our Teams platform and add team members: https://lnkd.in/eJ3pYVpb

    • The team branding form showing Frontend Mentor branding.
    • Frontend Mentor founder, Matt Studdert's, profile showing Frontend Mentor's branding on his avatar.
    • An open modal promoting Frontend Mentor for Teams, which reads: "Frontend Mentor for Teams helps companies and schools onboard and train developers through project-based learning. Our industry-standard projects give developers hands-on experience tackling real coding problems, helping them master their craft. If you work in a company or are a student in a coding school, feel free to share Frontend Mentor for Teams with your manager or instructor, as they may use it to help with your coding education."

相似主页

查看职位