Skip to content

Building Apps with No Code? A Web Component Future

Technology is continuing to advance before our very eyes quicker than we can consume or comprehend. We have come far in the past years with website building capabilities. Today, web development is easier because you can search the web for snippets of code to copy and paste onto your site. This method is still unfortunately messy, and people employing this method are typically pasting large amounts of code onto a page that they don’t understand.

The way we build websites continues to change, and advancements are helping us transition to a development world where anyone will be able to build complex applications with simple drag and drop functionality. What enables this? It’s web components. It may be hard to fathom that fully functioning applications could be created with little to no code, but with dedicated minds work to foster this paradigm shift, we are not too far from this. One of the projects working on this initiative is Google’s Polymer project.

Web components are shareable pieces of code that you can easily use in any application. They are a way to encapsulate styles and structure inside of an element such as an input element or a button element. With web components, you can package complex styled components such date pickers and use them on the web. Though web components are still a fairly new concept, the standardization of them is what’s creating our future.

While the standardization process is being developed, projects like Polymer allow web developers to create web components and assist with providing the polyfills needed to make the components work in all browsers.

The idea behind Polymer is to provide a structure for web developers to develop web components and share them without having to worry tasks like dealing with browser compatibility issues. Customization and creation of new web components is something those working on web components are trying to foster in the community. Polymer helps developers take prebuilt Polymer web components and customize them. Allowing greater access to web component creation helps develop the ecosystem and move us closer to mainstreaming web components.

Monica (@notwaldorf) is a self proclaimed emojineer at Google working on the Polymer project. At Google, she focuses on making developer’s lives easier by creating features to give developers more flexibility when developing web components. Monica has spoken at various tech conferences and has a background in computer science.

Some may wonder why Google cares about projects such as Polymer. Monica says, “Google is passionate about web components and Polymer because they make the web ecosystem better. These initiatives help all developers, but they also help Google developers scale code and share it across codebases internally. It allows everyone to stop recreating the wheel.”

Monica reminisces on 1995, the year the first iteration of the input element landed native in the browser. The input element allows web developers to easily specify types such as text, password, checkbox, radio button, and more even today. That was 21 years ago, and not much has changed with the browser APIs. The current browsers still only have have a couple more elements on top of the input, video, and button elements.

“We haven’t made any large leaps like adding date pickers, or responsive modals that work across all browsers. 20 years from now, we will have a large inventory of web elements, and the same way developers are using input elements natively now, then, custom elements will feel natural and we will use them like they were always there.”

Browser standards and adding native elements such as the input element are a slow process due to sensitivity with the API and the agreements across browser teams. Polymer gives the future advancement of the web to the people so the ecosystem can move faster and we can achieve a better web faster.

“Think of Polymer like jQuery for web components. If you were around in the 2000s, jQuery made writing JavaScript for the DOM easy. Polymer does the same thing for web components. It adds syntactic sugaring to make it easy to develop web components and affordances that are missing from the platform like data binding and data propagation.”

Large companies who have adopted web components have had success in using them to standardize their code base. If an organization has multiple projects, they are able to create an internal repository that houses their web components so teams can find ready-made, styled components to use in their applications. An added benefit is standardized components help companies have consistent brand and styles across all teams and web presences.

Polymer components change the way teams work together. If a company used Polymer as an interface for mockups, designers within an organization would be able to drag and drop pre-made elements onto a page to generate useful mocks easily and share those with the development team. It would be easier for companies to enforce strict guidelines of how they want their apps to look with a specific set of visual elements that become the standard. It also make is easier for developers to create MVPs from mocks this way.

Google has its own mockup tool to show developers the ease of using Polymer elements. The site, http://polymer-designer.appspot.com/ may be a bit outdated, but a second iteration of this tool is in the works. The mockup tool is functional now, and allows beginners to get functionality from APIs without understanding the API. Internationalization is a drag and drop feature, as are responsive layouts and elements that store your data offline. You can even have the functionality of Google Maps without writing a single line of code.

Polymer-CLI, a project that launched in 2016, is another initiative by Google that allows developers to start creating web components quickly. The CLI starts developers off with a responsive layout, routes and a Service Worker for offline support..

“Web components have also made the world funner. You can create art, or make components that help others create art. Some of the best web components I’ve created are emoji rain and emojilate. Emoji rain makes it rain emoji on your page, while emojilate takes any picture and converts the pixels to all emoji.”

With the quick advancement of projects like Polymer and the fast adoption of web components in the modern web ecosystem, we can see where the future is taking us, and play a part in history by using web components now.

Many companies have created great free open source components available for public use. A great way to get started is to visit webcomponents.org for a catalog of custom elements. Google’s Polymer team has created a set of custom elements for everyone to use and can be found at https://www.webcomponents.org/author/PolymerElements.

This Dot Labs is a development consultancy that is trusted by top industry companies, including Stripe, Xero, Wikimedia, Docusign, and Twilio. This Dot takes a hands-on approach by providing tailored development strategies to help you approach your most pressing challenges with clarity and confidence. Whether it's bridging the gap between business and technology or modernizing legacy systems, you’ll find a breadth of experience and knowledge you need. Check out how This Dot Labs can empower your tech journey.

You might also like

Effective Communication Strategies Within The Software Development Organization cover image

Effective Communication Strategies Within The Software Development Organization

Have you ever been in a situation where you thought you were communicating effectively, only to realize later that the other person misunderstood what you were saying? Have you ever communicated with someone only to hear that they felt you provided way too much detail, or that you didn’t provide nearly enough detail? Communication in the workplace is how ideas, updates, directions, etc are transferred to others. Each party in a software development organization has differing needs and expectations when it comes to workplace communication. By learning to tailor your communication to meet the needs of each stakeholder, you can become a more effective communicator and achieve greater success within your organization. The requirements of various parties that you interact with in the workplace can vary wildly depending on several factors. Your awareness of these individualized communication preferences and how you can give each party what they want and need will impact your effectiveness in your daily activities, your perception by others, and even your upward mobility within the organization. That's the power of communication, and why it's so important to master effective communication strategies in the workplace! In this article, we'll explore the different types of stakeholders in a software development organization, the communication strategies that work best for each group, and how effective communication can help you advance your career in the industry. We'll start by discussing the difference between “communication” and “effective communication”, before diving into the different types of stakeholders in a software development organization. Then, we'll explore the communication strategies that work best for each group, and provide actionable tips for improving your communication skills. Communication vs. Effective Communication When it comes to communication, it's important to remember that the intended message is only effective if it's received and understood by the recipient, regardless of their background or level of familiarity with the topic. Effective communication is about sharing thoughts, ideas, opinions, knowledge, and data in a way that ensures that the message is received and understood by the recipient. With effective communication, the sender and receiver leave the exchange feeling satisfied. There is a shared understanding of what was intended to be transmitted by the sender. Stakeholder Types In any organization, you have many different types of parties involved in a software project. Let's group the parties involved in software development into three categories for the sake of clarity: - Development Team__ - This consists of individual contributors, project managers, scrum masters, QA testers, UX designers, UI designers, architects, etc. - Product Team__ - The product team is made up of a diverse group of individuals, including product owners, business analysts, architects, and more. - Executive Team__ - CTO, CEO, etc. Each of these parties requires a different type of communication, a different level, and has different needs from your interactions to allow you to provide value from what you are saying and to for them view you as an effective communicator. Let’s talk a bit about what each of these parties needs, and how you can interact with them in the most meaningful way possible. Development Team This is the most detailed version of the interaction. This group needs to be communicated with on the level of individual tickets and the details of those tickets. When interacting with the development team, it's important to focus on the nitty-gritty details of each task, ensuring that everything is sorted through meticulously. With this group, we will sort through specific implementation details. An example of interaction with someone from this group might look like this, “I am currently working on ticket 473, and trying to get the checkbox to behave correctly during testing. I have no blockers currently.” Product Team This group will be communicated with at the level of features and larger increments of work such as project milestones. This group is interested in chunks of a project, milestones, progress on the overall initiative, etc. An example of interaction with someone from this group might look like this, “The team is wrapping up development of the new Project X User Interface and will be moving to the implementation of the functionality next”. Executive Team This group is interested in the conversation at the highest levels of abstraction. Generally, they will be more concerned with things at the overall project level. When updating the executive team, it's important to provide high-level updates that summarize progress and focus on next steps. For example, you might say, 'We're making great progress on Showcase X and are on track to complete it soon. Next, we'll be shifting our attention to project Y.' Types of Communication What are some of the types of communication? It’s a great question. When you begin to study various communication styles, you will read about different personality types, and how those personalities interact with the world around them. You might hear things like aggressive, passive-aggressive, passive, and assertive communication styles. While understanding these can help you communicate effectively, we will focus on how different roles in a company require different levels of detail and specificity in their interactions. Your Natural Communication Style We all have a natural way that we prefer to communicate. Some are very direct and assertive. We might tend to be very to the point, with no filler, no fluff. Others might naturally tend to be more verbose, to fill in lots of details and context and information. Some naturally meet somewhere in the middle on the spectrum of detail vs direct higher-level type of communication. There is no right or wrong answer, but you must be aware of your natural tendencies in conversation, and know how to use those effectively, or tailor your communication style to a specific situation or audience. Benefits of Tailored Communication What are the benefits of tailored communication? The primary benefits of tailoring your communication to different stakeholders are that you can provide each person with what they want and need in a way that resonates with them. For instance, I once had to adapt my communication style when working with a highly detail-oriented developer who preferred a more granular level of communication. This eases the amount of effort required by the other party to understand you, and allows them to be more effective in taking your message forward. It increases the perception of your effectiveness, and credibility in their eyes as well. If people know that you are someone who can communicate with multiple parties with varying interests and needs, and do so effectively, you will be trusted with more responsibility, and be given more opportunities. Using Effective Communication To Advance Your Career As you can see, developing effective communication skills is a powerful way to advance your career in the software development industry. How have you seen effective communication impact your work? People who are seen as effective communicators have staying power in an organization. They are viewed as competent and necessary. They are given positions of authority and trusted to get things done. I remember that, when I was just starting out in software development, I struggled to communicate effectively with stakeholders at different levels of the organization. But over time, I learned the value of tailoring my communication to each person's unique needs, and it has paid off in my career in countless ways. Basic Strategies For Improving Your Communication Know your audience__ When preparing for a presentation or conversation, it's essential to consider your audience and tailor your communication style to their needs. What are some strategies you use to ensure your message is received and understood? Write notes in advance, when possible__ Draw an outline or even the bulk of what you need to deliver before the time comes. Even if you don’t ultimately use these notes directly, preparing them will help you to distill your thoughts and clarify your message, as well as review that they have the appropriate amount of detail for the intended audience. Practice your delivery__ Though you will not always be giving a speech, talking through what you plan to say will help you to see gaps, smooth the flow, and make sure that you are comfortable with the material you will be presenting or communicating. Conclusion__ In this article, we learned about the importance of effective communication, strategies for improving your communication, and the direct and indirect positive impacts these improvements can have on your effectiveness and value in the organization. We explored various strategies and approaches to improve communication. Development in this area can yield amazing results for you as you make the investment to improve your skills. We hope you enjoyed this article, and found it helpful. If you have any questions please feel free to join the discussions going on at starter.dev or on our Discord....

International Women's Day Recap cover image

International Women's Day Recap

International Women's Day Event For this year's International Women's Day, we hosted a live event with Women Techmakers, featuring talks and a panel discussion on this year's topic: progress over perfection. It was a great conversation on what it's like to be a woman in tech, and how you can help yourself and others thrive in our industry. In case you missed it We have the full event on YouTube if you'd like to watch it yourself (which I highly recommend)! Here's a recap of everything that happened. Getting started in DevRel - Pachi Parra Pachi Parra was up first, sharing her journey into DevRel, and tips on how you can get started too! Some highlights include: - Roles that are available - What a day in the life might look like - Her journey into DevRel - What a DevRel professional actually does - things like public speaking, live coding, writing blogs, and giving talks at conferences. Her best tip for getting started? Find the type of content you like doing, and focus on doing that well! In DevRel, it's easy to spread yourself too thin between all the different types of content available, so focus on the one you like most, find a supportive community, and get yourself out there. :) Breathing Fire: Success and Growth as a Technical Woman - Stacy Devino Stacy Devino was up next, providing all kinds of insight into the cycle women go through in their career, as well as tips for each stage of the journey. She opened with an amazing quote: > Assume all women are technical and capable of breathing fire. - Jessie Frazelle Other highlights: - Igniting your world through learning, timing, your network, and leadership. - Staying warm by managing your focus and chores, recording your achievements, maintaining relationships, and researching ideas. - The key to avoiding burnout - keeping a long-term perspective, doing things for yourself, and allocating time for the things you enjoy and the people who support you. Riding the imposter wave to senior - Jessica Janiuk Jessica Janiuk wrapped up our talks today, providing insight into her journey through tech and the ways we can think about imposter syndrome and allowing ourselves to grow. Some highlights from her talk: - A few things to consider: what being "senior" means to companies and to yourself, if you're in the right place, and what you want in your career. - A great diagram of the imposter wave - the balance between our confidence and feeling like an imposter from this post by Ricardo Luevanos. - Considering how often we're comfortable, and that there's an inverse correlation between feeling comfortable and feeling like an imposter (they're opposite each other). - We have two choices: we can let it control us, or use that discomfort as a tool. - Looking back on our growth and realizing that our current lows are higher than our past highs. - Some senior advice: Be authentic, be proud of your work, have good mentors, remember that your work is not your life, and stay uncomfortable. She wrapped up with a brilliant reminder for us all: > You are capable. You are valid. You are important. Please take care of yourself. People care about you. If you're struggling, you're not alone. Panel Discussion We rounded out the day with a panel discussion featuring these accomplished women: - Erica Stanley - Amal Hussein - Deborah Kurata - Katerina Skroumpelou - Jessica Janiuk - Stacy Devino - Jae Bach Hardie - Linda Thompson The conversation flowed naturally, each panelist feeding off of each other's ideas, and we covered some very powerful and helpful tips and reminders for women in today's developer world. Here's a few of my favorite topics or ideas we talked about: What did you learn in the past year? - Have hobbies that don't involve tech. - Learning to let go of your previous tools. - How valuable close personal friends are - people you can trust and rely on. - Listen to yourself, and take time to introspect and evaluate. - Don't over commit! Finding a community and actively contributing to it - Women Techmakers! (Our joint sponsor) - Make use of social media. - "Reach one teach one" - always be willing to share your knowledge, and be the person you needed when you were getting started. - Engage people who align with your goals and values - reach outside your level of age, career scope, experience. - The interconnection between you and your people is not exclusive, it's inclusive! The more expansive your sphere is, the better you are at your job. - Also - we can find community in open source! The way people comment, commit, and support each other within a project counts too. Foundational knowledge vs tooling - Understand what problems you're actually solving and what to reach for, more than worrying about the specific tech stack itself. - This helps you build your own knowledge map, and pick up skills as you grow. - For more senior folks - realize when you've mastered something, and focus on clearing the road for those who come next. - Learning to delegate - if you always do something yourself, you're taking that opportunity away from someone else. - Knowing when to ask for help, and that asking is NOT a weakness or failure! It's a strength to know when you need to ask for help. Find your learning method - Ask multiple people if you need to until you find the answer that clicks for you! Ask why. - Not understanding the answer someone gives you is also not a failure - it's different viewpoints. - Also learn how the people around you learn - so you can help them in the way that best suits them. Communication and collaboration - Have compassion for everyone on your team. - When you collaborate, you get more done. - Being able to communicate and collaborate is a HUGE strength. Don't let anyone make you feel bad for being strong in those! - Being the person who's able to "glue" the team together is foundational to a strong team. Fighting stereotypes - Things that are commended in men and reprimanded in women, and fighting against those biases - Being authentic is the best way to lead your team - don't play into a stereotype you don't fit. - You don't have to sound "nice" or "pleasing" - you're still a strong woman and you're going to be judged a certain way, so don't compromise! - Unpacking all the social conditioning and learning to be comfortable with yourself all the time, in all the situations we find ourselves in. Wrapping Up The entire event was filled with wisdom, laughter, and camaraderie. We're so thankful to the ladies who came to speak with us, and hope to see you at the next one!...

How to Start a Developer Relations Program cover image

How to Start a Developer Relations Program

Developer Relations (DevRel) is a role that’s often misunderstood, undervalued and underrepresented. Some think it's just a marketing department, while others believe it's solely responsible for developer relations. In fact, DevRel is a key part of your company's product team and should be involved at every stage of the product lifecycle—from inception through launch and beyond. The goal of this article is to help you understand the basics you need to start a DevRel program so you can hire the right people, build an effective team structure, measure success, and report on it effectively. What is developer relations? Developer relations (DevRel) is a cross-functional role focused on building relationships with developers, who are users of your product. DevRel plays a critical role in helping teams build and promote their products, by providing support and advocacy for developers. A DevRel team may also be responsible for enforcing developer guidelines, building examples or integrations into your product, or curating content about your product or platform. All of these combined help create a great and sustainable developer experience. How does DevRel fit into your organization? Simply put, DevRel is a strategy and set of tactics that can be used to launch products and platforms aimed at developers. DevRel is not a replacement for product marketing and community management—it's an extension of both, and usually overlaps with these two other practice areas quite often. In smaller organizations, you may have a team doing all three simultaneously! Nevertheless, any DevRel team should be focused on keeping developers engaged in your product throughout its lifecycle. While many companies have developer relations teams, many companies also do not do so intentionally. Some DevRel focused team members may have started out as developers, community managers, or even customer success managers who did outreach to developers on their own initiative. The DevRel role has also been known as Developer Outreach or Developer Marketing; some companies use these terms interchangeably with DevRel. Regardless of what name you choose for this function at your company (or if you choose none), remember that the job is fundamentally about relationships: engaging with people who are interested in your technology through communication channels such as events, blogs/forums/discord/slack/social media accounts, github, etc. When should you start building a devrel team? You should start building a developer relations team when you have a product or platform that is ready to launch and you have a clear strategy for how to launch the product. You should also be able to answer the following questions: - Who is your target audience? - What does your product do? - How does your product work? - What goals are you trying to achieve? If you don’t have a clear answer to these questions, then you need to figure out the answers before you start building a developer relations team. A DevRel person can help you refine how a customer learns about your product, where they can learn more about it (building out developer onboarding experiences), and help you refine the strategy to create a more cohesive developer experience for increased stickiness and adoption. How do you measure success and report on devrel? You can create metrics to measure the success of your devrel program, but you should also keep in mind that it's important not to get too hung up on numbers. When you're tracking impact, it's easy to obsess over data; however, there are other important factors that need to be considered as well. For example, if your developer relations team has been working hard for months and has acquired only a few new customers, that is still worth celebrating because it takes time to build community! You cannot force community and community adoption. It is something that grows with time. When starting, and throughout your devrel program, you want to measure the success of your devrel efforts by looking at more top of the funnel metrics like how many people are visiting or downloading your public-facing content, your social media profiles, and communities. How much value are they getting from your content? Focus on providing value, because consequently, if developers find your content and product/ platform valuable, they will share those links. You should also do competitor research and general industry research in your specific niche and create a baseline! How often are product updates being shared by influencers? How are other products getting developer adoption? These metrics will help give you an idea of what works best for your particular industry. The key is experimenting with different ways of gathering data until something sticks! Conclusion At the end of the day, developer relations is a complex field that can be difficult to understand. But, it’s also not rocket science. It requires an understanding of the market, best practices, and most importantly, authenticity. Luckily, there are many resources out there to help you learn more about it! If you’re interested in learning more about devrel and how it can benefit your company as well as your customers, take a look at some of our favorite articles: - Defining a career path for Developer Relations by Bear Douglas, Developer Advocacy Lead at Slack - What Is Developer Relations? by Justin Warren for Forbes - What is developer relations? Understanding the 'glue' that keeps software and coders together by Owen Hughes for ZDnet - What is Developer Relations by Sam Julien - What is Developer Relations? by Kim Maida We also help with this at This Dot! If you’re interested in learning more about our developer relations program, send us an email anytime! tracy@thisdot.co or sarah@thisdot.co!...

Software Team Leadership: Risk Taking & Decision Making with David Cramer, Co-Founder & CTO at Sentry cover image

Software Team Leadership: Risk Taking & Decision Making with David Cramer, Co-Founder & CTO at Sentry

In this episode of the engineering leadership series, Rob Ocel interviews David Cramer, co-founder and CTO of Sentry, delving into the importance of decision-making, risk-taking, and the challenges faced in the software engineering industry. David emphasizes the significance of having conviction and being willing to make decisions, even if they turn out to be wrong. He shares his experience of attending a CEO event, where he discovered that decision-making and conflict resolution are struggles even for successful individuals. David highlights the importance of making decisions quickly and accepting the associated risks, rather than attempting to pursue multiple options simultaneously. He believes that being decisive is crucial in the fast-paced software engineering industry. This approach allows for faster progress and adaptation, even if it means occasionally making mistakes along the way. The success of Sentry is attributed to a combination of factors, including market opportunity and the team's principles and conviction. David acknowledges that bold ideas often carry a higher risk of failure, but if they do succeed, the outcome can be incredibly significant. This mindset has contributed to Sentry’s achievements in the industry. The interview also touches on the challenges of developing and defending opinions in the software engineering field. David acknowledges that it can be difficult to navigate differing viewpoints and conflicting ideas. However, he emphasizes the importance of standing by one's convictions and being open to constructive criticism and feedback. Throughout the conversation, David emphasizes the need for engineering leaders to be decisive and take calculated risks. He encourages leaders to trust their instincts and make decisions promptly, even if they are uncertain about the outcome. This approach fosters a culture of innovation and progress within engineering teams. The episode provides valuable insights into the decision-making process and the challenges faced by engineering leaders. It highlights the importance of conviction, risk-taking, and the ability to make decisions quickly in the software engineering industry. David's experiences and perspectives offer valuable lessons for aspiring engineering leaders looking to navigate the complexities of the field....