OpenGraph - lexis.solutions

charts-cover

Milush-photo

Unspash Plugin for Figma

Meta description Lexis Solutions

Stefan Mitov

Agenda Admin Cover

QA-cover photo

Radoslav

fire emoji

Emil Kirilov

Deyan Denchev - new2

Milush mentoring Ivan

SERP example - largest volcano

SERP example - how to roast a potato

Mira

Beach Photo

The Manifest

Milush Karadimov

Software Developer

Radoslav Kosev

QA Engineer

Full Stack Developer

Deyan Denchev

CEO & Co-Founder

Web Developer

Mira Ereeva

Growth Manager

## My FAQ story 

After going through the rockiest parts of the QA path, I am competent enough to give you some insight into the questions that naturally come up in the training process.

## Reality check

Like many juniors in the Quality Assurance field, I quickly realized that offline and online courses fall short of preparing you for the real world. Plenty of questions that appear trivial at first glance are complex once you scratch beneath the surface. Let’s unpack them one by one.

## Who is the QA? 

QA as a person, is responsible for making sure that all parts of the software work intact both together and separately. QA as a process is the systematic and comprehensive procedures defined and followed by QA specialists. 

![QA-mistakes](//images.ctfassets.net/5gydaotbo8jm/5vzBacw8fWNfS8JDHFW1R1/c4d496245e48c6d4db33d853889604fe/QA-mistakes.jpg)

## What does a QA do?

In an IT company, a QA would be concerned with tracking the progression and [development process](https://www.lexis.solutions/services/node-js-development) of what is being worked on. He points out what is a good idea and what is not and keeps track of the requirements and tests according to them.

Textbooks say that "QAs ensure that the products customers receive consistently meet or exceed expectations." or perhaps "QAs follow a process that reduces the costs for the stakeholder by ensuring that bugs and inconsistencies are rare and sometimes avoided.". That said, I much prefer bullet points that better depict the actual work being done:

- QAs assist the process in which the "inquiries" transform into a well-structured documentation
- QAs are proactive and responsible for minor changes that play in the big picture that help the project save time and money
- QAs explore the products being tested for a better understanding of the product's business objectives
- QAs identify potential weaknesses at every stage, starting from the planning phase
- QAs measure the user-friendliness of the product (through surveying end users and getting their feedback, for example)
- QAs maintain customer trust through communication with the clients.

## Why are QAs necessary?

As QAs, we possess broader product knowledge and understanding of how to use the system in the way a real user would. We are also accustomed to catching edge-case bugs and have observed first-hand the peculiar ways some individuals use software solutions. Through our skills and experience, we ensure that the product meets the client's requirements and that we have shipped exemplary software. 

![QA-Tester-meme-02](//images.ctfassets.net/5gydaotbo8jm/70Nyyn6jBp85tz45Fn8oPY/9ed34fb1fa4941b332a02870f9a95564/QA-Tester-meme-02.jpg)

## What is the proper mindset for a QA?

A QA is supposed to be critical to a top point, starting from the planning phase. QAs should also emphasize requirement consistency and speculation of possible problems that might occur before the actual work of the product has begun. During the development phase, a QA is supposed to do mindful testing, mimicking the user behavior while also exploring edge cases. This process is documented, and the main usage scenarios become user stories and flows that need to be tested regularly.

![testing meme12](//images.ctfassets.net/5gydaotbo8jm/3fx8LYsvqB80Gesetb4vO4/1117042af2e6b42267c755410e88363d/testing_meme12.jpg)

##  Are we so OP to spot all those evil bugs?

No, and that's fine! We are considered an effective QA not by the quantity of discovered bugs but by their severity. So, what we can do to be the best version of ourselves as QA is to be consistent in our working and learning process. 

This means that we sometimes catch all the bugs. But our persistence pays well in the end:
- We become efficient.
- New ideas appear with new projects.
- We get to be more reliable for our colleagues

![there-is-always-one-more-bug-qa-engineer-test-noirty-designs](//images.ctfassets.net/5gydaotbo8jm/63wOlsXMkkmkW7xVjZjqyP/98a8ec520e1530b7002b6525a0ea9534/IMG_20221101_140527.jpg)

## Bonus: Quick-growth hacks

It is essential to have a sense of continuous and gradual improvement because you risk losing motivation, becoming frustrated, and even giving up without it. Let me share some tips for maintaining a positive attitude and taking control of the training process:

- Mentally prepare for a lot of new information. A LOT. QAs speak their language, and learning it will take time, patience, and consistency.
- Communicate with your seniors constantly. Search for tips and inquire about the correct terms, as there are plenty of them to memorize. You never know what gem might come up in a regular conversation.
- Attempt daily meetings with anybody more experienced than you and chat about the IT world. The common knowledge adds up, and you even make some new friends.
- Spend time on your reading, researching, and googling the topics you’re working on or are about to work on. The most effective learning method is studying something you are interested in. Find where your passion is at the moment and follow it. The QA world is vast, and you will always be able to find a curious topic to delve deeper into.
- Ask questions. Ask your seemingly foolish questions too. And if you heard the phrase “there’s no such thing as a “stupid question,” only an unasked one“? Oh, there are. Plenty. Still - ask bravely. 
- Take hints from past projects. Discuss with your seniors how previous systems were designed and where the problems lay. That includes what bugs appeared during their development, what was important, what wasn’t, and what the priorities were. Absorbing the condensed experience of your peers will make you ingenious in the new projects you take on. Learning from others is a life skill that is undoubtedly beyond precious for upcoming QAs.
- Take advice from seniors, observe their working methodology, how much time they spend on their work, and how they tackle their problems. You might receive advice that they applied and it didn’t work for them, but it works for you. 
- Remember to laugh during the process. You cannot be serious all the time. Mistakes occur while writing the documentation while testing, and communicating. Accept them as part of the learning process, and may laughter be the spoon of sugar that you need during learning.

## Conclusion

You have officially stepped into the shoes of the QA and know the answers to the frequently asked questions. Keep in mind - the series “In the shoes of a QA” is just beginning and will continue with the hottest topics like: 

- REST API
- GraphQL API
- Manual Testing
- Writing Test Scenarios
- Automation
- Useful tools

## [See you next time](https://www.lexis.solutions/blog/how-to-test-REST-ful-APIs-with-postman) and until then, remember to

![3376755](//images.ctfassets.net/5gydaotbo8jm/5lYbHBRabhP5alBTojO4C0/ce7de2dd6dba9621ea7a0ba46b70d6c8/Screenshot_2022-11-01_at_14.04.27.png)


Answering the same questions I had in your place and providing some valuable tips on beginning the QA journey. 

Into the shoes of a QA: The FAQ

From fonts to access to stunning images & royalty-free stock, Lexis Solutions has prepared a list of free resources for all UI designers. 

## PHOTOS

### [Pexels](https://www.pexels.com/)

![Pexels](//images.ctfassets.net/5gydaotbo8jm/6M6l42lfE20dYPrr3Alsyq/e29bab3ddf21aea90f244391e946c5e0/Pexels.png)

Free stock photos & videos you can use everywhere. Browse millions of high-quality royalty free stock images & copyright free pictures.

*Alternatives:*

- [Pixabay](https://pixabay.com/) is a vibrant community of creatives, sharing copyright free images, videos and music.
- [Unsplash](https://unsplash.com/); Beautiful, free images and photos that you can download and use for any project. Better than any royalty free or stock photos.
- [Burst ](https://burst.shopify.com/)is a free stock photo platform. The image library includes thousands of high-resolution, royalty-free images that their global community of photographers shot.

## VIDEO
### [Coverr](https://coverr.co/)

![Coverr](//images.ctfassets.net/5gydaotbo8jm/D12IIyCieJYPyldOeHtfW/7fd183fb3ce009e7c3b461d8007ad841/Coverr.png)

Coverr is a resource for beautiful, free, and exclusive stock videos for commercial and non-commercial use, requiring no attribution. Coverr should be your go-to destination when searching for a video for your next project.

*Alternatives:*

- [Videvo](https://www.videvo.net/); 500,000+ stock footage clips, motion graphics, Premiere Pro templates, After Effects templates, royalty-free music, and sound effects, all at your fingertips.
- [Videezy](https://www.videezy.com/) is the place to share your Free HD Stock Videos, b-roll, backgrounds, and other fantastic free video footage. Here you can explore and discuss the footage of other videographers worldwide or find that perfect little cutaway for your next big project.
- [Life of Vids](https://www.lifeofvids.com/) is a platform offers free videos for personal & commercial uses; new videos are added weekly! 

## Fonts
### [1001freefonts](https://www.1001freefonts.com/)

![1001 free fonts](//images.ctfassets.net/5gydaotbo8jm/1kFfTGrplkeVLfv15FFiVZ/7e5d8a521cc41e4b43231f4f4c8f5ad2/101freefonts.png)

Download free fonts for Windows and Mac. Browse categories such as calligraphy, handwriting, script, serif, and more. New fonts are added daily.

*Alternatives:*

- [Google Fonts](https://fonts.google.com/) is a library of 1455 open-source font families and APIs for convenient use via CSS and Android. The library also has delightful and beautifully crafted icons for everyday actions and items. Download them for your digital products for Android, iOS, and the web.
- [Dafont](https://www.dafont.com/); Archive of freely downloadable fonts. Browse by alphabetical listing, style, author, or by popularity.
- [Front Space](https://www.fontspace.com/popular/fonts); Free downloads of legally licensed fonts that are perfect for your design projects. The best place in the universe to search for unique fonts.

## Icons
### [Fontawesome](https://fontawesome.com/)

![Fontawesome](//images.ctfassets.net/5gydaotbo8jm/AQvjvPP56vG0F6ijD4weK/d9c8be25f042c1a7a290d6c82dcc9674/fontawesome.png)

Font Awesome is the Internet's icon library and toolkit, used by millions of designers, developers, and content creators.

*Alternatives:*

- [Iconfinder](https://www.iconfinder.com/) is the world's largest marketplace for icons, illustrations, and 3D illustrations in SVG, AI, and PNG formats. It has more than 239649 free vector icons.
- [Noun Project](https://thenounproject.com/) features the most diverse collection of icons and stock photos ever. Download SVG and PNG. Browse over 5 million art-quality icons and photos.
- [Flaticon ](https://www.flaticon.com/)is a database of free vector icons. A tool that converts icons into web fonts. Access 8.3M+ vector icons and stickers. Resources made by and for designers. PNG, SVG, EPS, PSD, and CSS

## Mockup generator
### [Visme](https://www.visme.co/mockup-generator/)

![Visme](//images.ctfassets.net/5gydaotbo8jm/48ZyGWtYDmacFLlOTVmTME/1eb4099e9c1403798637c1453c5ce4c8/Screenshot_2022-10-27_at_14.42.23.png)

Visme is an online tool for creating, editing, sharing, and storing visual materials. You can use it as a presentation app to make slide decks, but you can also create templates for infographics, charts, logos, storyboards, graphics for social media posts and the web, letterheads, and other items. 

*Alternatives:*

- [MockupBro](https://mockupbro.com/); You can create product mockups with MockupBro! Just choose a mockup, upload your design and download your image without a watermark!
- [PixieLied](https://pixelied.com/mockups) is an easy-to-use design solution that allows users to create stunning ready-made designs from 25+ formats and access millions of stock photos, icons, and illustrations.

## Design inspiration 
### [UI Design Daily](https://www.uidesigndaily.com/)

![UI design daily](//images.ctfassets.net/5gydaotbo8jm/6f0CIvfaUTPubhDlt9Xyff/b0cbcdaf48282f5f10341380f90d9799/Screenshot_2022-10-27_at_14.43.22.png)

- [Dribbble](https://dribbble.com/tags/free_design_system) is a self-promotion and social networking platform for digital designers and creatives. It serves as a design portfolio platform, jobs, and recruiting site and is one of the largest platforms for designers to share their work online. 
- [Voog Design System ](https://voog.design/)has everything from multiple examples of the style, colors, typography, layout, and grid. Also, there are many examples of components like forms, buttons, tables, modals, popovers, editors, placeholders, navigation, eCommerce, dashboard, and container.

*Read next: '[Powerful and Free Tools for Content Creation](https://www.lexis.solutions/blog/powerful-and-free-tools-for-content-creation)'*

A list of free resources for all UI designers.

Free Resources For Resourceful UI Designers

## Introduction

We all realize the importance of creating the minimal bundle size possible and performing numerous optimizations to mitigate the effects of the dependency mesh. I believe we can tackle the issue effectively by choosing the right libraries, and I would argue that Chartist is one of the best choices for charts.

## Bundle size

Why is bundle size important? The quick answer is speed and load time. More libraries mean more code, more code is more MBs, and more MBs mean a longer download and code-processing time. That said, pick the correct libraries, reduce the bundle size and make your user happy!

## Considerations when picking a library

The libraries you pick should be widely used, frequently updated, and documented. It is always reassuring to see a few dozen contributors mentioned and if the library has a dedicated website, it is solid. Do not forget to check the number of dependencies, as this is an easy way to bloat the bundle size and people often overlook it. Attempt to pick libraries with the fewest dependencies possible. For example, Chartist has no dependencies!

## Why Chartist

Chartist covers the basics, is customizable, and has the FAQs already answered by the community. It is also ~10kB when minified and zipped and has 0 dependencies.

I like it because it is easy to use and has responsiveness options. Take a look at a few examples:

- [Responsive bar](https://codesandbox.io/s/github/chartist-js/chartist/main/sandboxes/bar/extreme-responsive?file=/index.ts:359-372)
- [Horizontal bar](https://codesandbox.io/s/github/chartist-js/chartist/main/sandboxes/bar/horizontal)
- [Line chart with 3 lines](https://codesandbox.io/s/github/chartist-js/chartist/main/sandboxes/line/simple?file=/index.ts:0-34)
- [Line chart with area](https://codesandbox.io/s/github/chartist-js/chartist/main/sandboxes/line/area?file=/index.ts:0-34)
- [Bi-polar area line chart](https://codesandbox.io/s/github/chartist-js/chartist/main/sandboxes/line/bipolar-area?file=/index.ts:0-72)

## My experience
### Discovering Chartist

The project I currently work on is SEO focused. We have emphasized speed and HTML semantics to reach the top of Google search results. I couldn’t afford to pick any charting library as most are needlessly bloated and could prove detrimental to our SEO score. Proper research was due... 

Google and Stack Overflow are my go-to sources of information. I reviewed the top results, rephrased my search term several times, and eventually landed on the Chartist website. The statement “ONLY 10KB (GZIP) WITH NO DEPENDENCIES!” hooked me. As I read further into the documentation, the library seemed to fit my needs perfectly.

![Chartist Hero](//images.ctfassets.net/5gydaotbo8jm/4nxktIApE6x6jM8AzGNry3/8e7fdb4e147372dbf2d94b4f63e517f5/chartist-hero.png)

### My task

My job was to create a dynamic line chart representing trends over the last 5 years. The first chart is the goal and the second chart is the result I got using Chartist.

![Chart Goal](//images.ctfassets.net/5gydaotbo8jm/1mXCL7MoB1JmYbfLPrVrHZ/a6cb6b3255107a6061992bc92321e732/chart-goal.png)
![Chart Result](//images.ctfassets.net/5gydaotbo8jm/75HegIRYYFCTkGZNSsLPuq/ea21c1e0c3b22c3195348b19f1844e02/chart-result.png)

Research, implementation, and troubleshooting all took me around 3 hours - much less than what I expected given the performance restrictions put on the application. 

## Customization

### Options

This is the code I started with

![code1](//images.ctfassets.net/5gydaotbo8jm/7MMgV6jn2anonhAI8kbaTQ/a8dd5339a9154d0f9a10345d63779a01/Screenshot_2022-10-21_at_15.17.02.png)

*And this is what it got me*
![chart3](//images.ctfassets.net/5gydaotbo8jm/26s4z1xycoJhSkQXEewUU2/ce9632a8495358c2ed5bb1c338312aa6/image__2_.png)

The elephant in the room was the coloring. Everything else was tolerable the way it came. It turned out, however, that I fixed several visuals just because it was easy to do so. 

Let us start by eliminating the elements we don’t need - the points and all but the zero grid line. Extend the options like this

![code2](//images.ctfassets.net/5gydaotbo8jm/5rT6rIrdJPHmCVaZMj05SQ/ba45d3a1fd9447712d2a1fcb5bb3be89/Screenshot_2022-10-21_at_15.19.24.png)

`showPoint: false` will hide the points
`axisX: { showGrid: false }` hides the vertical grid

Inside of `axisY`
`referenceValue: 0` will guarantee we have the 0 horizontal grid line and 
`labelInterpolationFnc: value => value === 0 ? value : null }` will hide all horizontal grids of values different than 0

*The result we got is this*

![chart4](//images.ctfassets.net/5gydaotbo8jm/01en7B55DmYH3Fe6c5IbvQ/ec95cbf4b77ac35b42ed1b77f984a8d5/image__3_.png)

### CSS

Chartist comes with default colors for the lines and the area beneath them. The easiest way to change them is done via plain old CSS.

Each of the data series (lines) receives a class name in the format of `ct-series-{letter}` where letter is a,b,c…

![code](//images.ctfassets.net/5gydaotbo8jm/1LjnHOz51UNjvItw7LLVzg/1f5bb896e87536957e74ff870d00cbac/Screenshot_2022-10-21_at_16.41.40.png)

As you can see the chart is in fact an SVG so the color manipulations happen via the stroke and fill properties.

![code3](//images.ctfassets.net/5gydaotbo8jm/7qdXyCRZDhdMOeTgz7kaBF/cb6586036dc1a942d8fbd6a790ab0f62/Screenshot_2022-10-21_at_15.21.33.png)

`#red-gradient` and `#green-gradient` represent the custom gradients I needed for the area beneath the red and green lines. You must define them as follows somewhere in the HTML.

![code4](//images.ctfassets.net/5gydaotbo8jm/PzTdNnXF4jbYCu0PgZfLT/1bc0d6a7a12f4d3b6f7c607fee0ab90d/Screenshot_2022-10-21_at_15.22.45.png)

The last changes produce this and it’s almost pixel-perfect!

![Chart Intermediate](//images.ctfassets.net/5gydaotbo8jm/6fi5eoINFsLKwyfHIGjC6N/bc7fbcfef72a1366596ba5676375ef69/chart-intermediate.png)

### Conclusion

By now, we have nearly nailed the design. You can reach the result with further customization, but that’s not the point. What is important is that you got the basics of a library that does a splendid job and is 10+ times lighter than what you’d expect. Just imagine the impact a proper selection of libraries can have on your next project’s bundle size…


What to look for and consider when searching for a chart library.

А Real-World Example for Picking Better Dependencies

Lexis Solutions is a dedicated [development](https://clutch.co/directory/mobile-application-developers/packages) company that supports SMEs in their projects. We provide digital solutions to aid organizations in crafting revolutionary digital products. We’re a team of experts with a proven track record of building successful solutions. Our core purpose is to enable your business idea to come to life.

Today, we’re happy to announce that we’re one of the leading vendors on The Manifest, a [company list blog](https://themanifest.com/bg/web-development/companies#most-reviewed). According to their latest research, we’re one of the most reviewed web developers in Bulgaria this year!

“*Lexis Solutions has been growing steadily over the last few quarters and are now ready for new challenges. We thank our clients for the generous feedback and Clutch for giving us a platform for reaching new opportunities. Being named top 15 in Sofia is truly humbling and only reinforces our belief in working diligently. Lexis Solutions will continue to deliver the finest quality software and place emphasis on effective communication while doing it.*”

*__Deyan Denchev - CEO, Lexis Solutions__*

Since our inception in 2017, we have been working hard to lead our clients to digital product excellence. We appreciate the support you’ve given us over the years, and this award is a testament to the mutually beneficial relationships we’ve established.

Find out more information about our projects on The Manifest, a business platform. Organizations worldwide use The Manifest to support their research before making informed partnership decisions with some of the best service providers out there.

If you want to learn more about our partnership process, please get in touch, and let us know what you need help with.


The Manifest's team article about another of Lexis Solutions' achievements! 

The Manifest: Lexis Solutions is among the Most Reviewed Web Developers in Bulgaria

## Introduction

Here at Lexis Solutions, we deal with complex projects every day that involve scheduling and micro-service coordination. Until now, we had tried different solutions for job processing, but somehow we always felt that something could be done better. That’s why we decided to develop our technology and make it open source so everyone could benefit. This article explores how and why we created a new open source job queue dashboard - [Agenda Admin](https://github.com/lexis-solutions/agenda-admin).

## What is a job queue?

A job queue contains a list of jobs waiting to be processed by a subsystem. It's the first place that a submitted job goes before becoming active. The job is held in the queue until some factors are met.

There are many job queue implementations for Node.js, including Bull, Bee, and [Agenda](https://github.com/agenda/agenda). 

*Let's take a closer look at Agenda.*

Agenda is an open-source, lightweight job scheduling library for Node.js, with many features like job priority, concurrency, and repeating, which uses MongoDB for the persistence layer. 

One of the main issues is that we have to write code whenever we want to create a new job or view the old one. While it's not hard, it is slightly inconvenient. That's why we need a dashboard with all the basic functionalities, like a list of all jobs or creating/deleting jobs.

## Existing Solutions

So far, there has been only one solution to this problem - Agendash, an open-source dashboard for Agenda. It allows us to schedule new jobs, requeue or delete old ones and search old ones, among other things; however, a few improvements could be made. 

While the UI/UX could also be improved, the main issue was that many pull requests took too long to merge. Because of that, some basic functionalities, like deleting or requeueing jobs, were buggy or not working.

__Note:__ *As of writing this article, the most crucial bugs are already fixed on Agendash. Kudos to their team 💯*

![Agenda Study1](//images.ctfassets.net/5gydaotbo8jm/4PIzJMeuVmiOaXOoTEjxKx/6b510eb73073c71854bf1ab57d755c5f/1.jpg)

## Our Solution

Our goal with Agenda Admin was to create a dashboard with a clean and easy-to-use UI and all the essential functionalities we needed to make working with jobs easier:

- jobs status, refresh interval is 15 seconds by default
- search jobs by name, including autocomplete
- filter jobs by metadata and status
- view job details
- delete and requeue jobs
- schedule a new job.

The user can see a list of all jobs, with the basic information for each one - their status, name, the last time the job was run, and when it will be executed again. Filtering the list was also a critical feature, with options to filter the jobs by their name, status, or some of their other properties. 

![Agenda Study2](//images.ctfassets.net/5gydaotbo8jm/5AqzYNooJGbuSKsp2yrtWI/8e5f28e12c4a9f1ac7f9c522fbd57daa/2.jpg)
![Agenda Study3](//images.ctfassets.net/5gydaotbo8jm/5o77wmUAzhVU8BiX2JG2bQ/da1ff346433fccd71cc1fb7bac1c7b79/3.png)

## The Architecture

For this project, we went for the mono-repo architecture, with the two main subprojects being the api, written in Node.js, and the client application, written in React. This approach has many advantages, including a shared build process for both the api and the client and enforcing code style standards across the project.

We used yarn workspaces and the mono-repo architecture to improve our dependency management. This allowed us to avoid unnecessary bloat by managing the dependencies across the whole project instead of having separate node_modules folders for each package.

![Agenda Study4](//images.ctfassets.net/5gydaotbo8jm/PxP8ki2WfQRwEkN4cW3qa/4ba798dae7766ba285abf65fe35d4fc7/3.gif)

## The Development Process

We used Linear to track our tasks and bugs to make the development process more efficient. Linear's integration with GitHub was also convenient, allowing us to link every pull request to the corresponding ticket. 

Of course, it was also essential for the whole team to be up to date on the progress, so we would meet regularly to discuss what had been done and how we should proceed with the upcoming tasks.

While not the most fun part of the project, we had to ensure that every app function was covered with tests to avoid any bugs. And to make catching bugs even easier, we automated the testing process with GitHub Actions. By automatically running the tests on every pull request, we could be confident that every regression would be caught before it reached production. 

However, unit tests can only take us so far. While we could catch bugs in the logic, we still had to ensure there were no issues with the user experience. This is where we had help from the rest of the people at Lexis Solutions, as they would constantly test the app and report any inconveniences, so we could fix them and provide the users with the best experience possible.

We were also able to automate the application's deployment, including tracing the version number and publishing the package. This was achieved by using semantic-release and, again, GitHub Actions. Also, by following strict commit message conventions and prefacing every commit message with a specific flag depending on the changes, semantic release could quickly figure out the following version number. By creating an automated workflow for publishing the package, every time a branch was merged into the main, a new package would be published on NPM.

## Conclusion

Now Agenda Admin is available as an [NPM package](https://www.npmjs.com/package/agenda-admin), and as an open-source project on GitHub, at [lexis-solutions/agenda-admin](https://github.com/lexis-solutions/agenda-admin). Everybody is welcome to suggest new features or contribute; don’t forget to star it.


The process behind how Lexis Solutions created a new open source job queue dashboard - Agenda Admin.

Contributing to Open Source: How We Crafted Agenda Admin

A few weeks ago, [Lexis's CEO gave terrific tips and tricks to master your interview for any developer position](https://www.lexis.solutions/blog/tips-to-master-interviews-for-any-developer-position). In addition, we will now focus on the most crucial part before the interview: the CV. 

## Are you preparing your CV for the very first time?

Firstly, make the center of attention any internship, courses, etc., closest to your selected job offers. But if you don't have any, never be ashamed of other experiences.

Let's say you worked in the customer service field for a few years before you decided to switch your career path, or you are still a student, so you performed a job to sustain and meet your ends - put that in your resume as well. It shows you gained experience and specific skills, are aware of the work ethic and weren't switching from place to place. 

But any other courses show dedication too. Even if they don't relate 100% to the job you are applying for, the person checking your CV will consider that you have put the effort to gather [knowledge](https://www.lexis.solutions/blog/why-does-knowledge-matter) or have a specific interest and decided to develop it. Don't forget to mention participation in university competitions, hackathons, academies, etc. 

## English C1 vs. C++?

Good [knowledge](https://www.lexis.solutions/blog/why-does-knowledge-matter) of English is a must when working in IT. If you don't know it even on a basic level, the chance of you getting hired is closer to zero. We strongly suggest you put in the effort and attain a decent mastery of the English language to further your career. 

And it's not only English! Most Bulgarian developers work on international projects, so any language apart from English will be welcomed.

## Powering your skills

We live in a time when soft skills are the game changer. So never second guess yourself and list all of the ones you possess. 

You need more practice if you are not confident enough in your communication skills. Don't worry about the interview process; instead, apply for companies that are not your first choice. This way, you will gain experience without sacrificing your go-to employers. Your friends could be of help too. They might imitate an interviewer and [ask you some questions Deyan shared with us](https://www.lexis.solutions/blog/tips-to-master-interviews-for-any-developer-position). 

But, of course, don't miss all the technical skills - especially if you have any of the listed ones on the job offer.

## Does a higher degree get your foot in the door, or is the experience the one that sells you? 

Education matters, but your skills and experience will benefit you more in the real working world. A higher degree will put you ahead of other candidates only when your practical skills are comparable. 

## Social media?

Your Linkedin and Github profiles are the only acceptable links you might add to your resume, so make sure they represent you well. If any concern appears that you don't have a lot to add to your profiles - the Internet once again might be your saver. Look for a free course and enroll right away. After finishing it, highlight it on the platforms. Check if there are any IT-related events or lectures in your city, and go networking - you never know where your luck might surprise you. 

## Picture or no picture? That's the question.

Should you add a photo to your resume? It depends. As we mentioned in a previous blog post, if you are applying for a job in the US, UK, or Canada, don't submit one. [Read here why.](https://www.lexis.solutions/blog/tips-to-master-interviews-for-any-developer-position)

If it is not explicitly mentioned that you should put one, it is a personal choice whether to add it or not. Some recruiters might argue and advise you not to do it - especially if not required. 

A passport photo is always the best option. Don't forget - the picture should be appropriate, never one from your prom, birthday party, or wearing something provocative. Usually, how you look is the least important to the hiring team, but adding an unsuitable image will probably play a bad joke on you.

## Note that your CV should be easy to read.

The hiring team will probably not spend much time scanning it, especially if there are many applicants. So here are some tips:

- use a black, easy-to-read font in one size  
- use short sentences and break up blocks of text
- use bullet points to list information
- keep the tone formal
- avoid abbreviations, slang, or jargon
- аvoid additional photos or images
- have strong headings
- keep your CV to a maximum of two pages.

__*Pro Tip 1:*__

Sometimes you might need to adapt your CV to the specific job offer. So always have the ready-to-go version (best if it is PDF saved), but always try to make it work for you so later you can work for them! Make your research on the company - see what they value and the leading technologies they use - and highlight that on your resume, especially what they want and what you have aligned.

__*Pro Tip 2:*__

Make sure your email sounds professional. It should only consist of your name and surname. Nothing else. No numbers (especially the year you were born) or any nicknames. And check a few times if you haven't missed a digit when adding your phone contact.  

__*Pro Tip 3:*__

Leonardo Da Vinci once said, "Simplicity is the ultimate sophistication." So take that in mind when creating your CV. Don't choose a colorful template or one that would be suitable for jobs on the more creative side, and try avoiding the European variant. 

Never pay for "special" options; there are many free platforms where you can create a simple but beautiful resume. For example, you can always use [Enhancv ](https://enhancv.com/)- a Bulgarian CV builder. 

## Motivated people always find a way

A motivational letter might be the joker for you who just started applying for jobs. Of course, you could read a few to get the right idea. But, please, never copy from a ready-written-one; the recruiters will notice immediately. 

The letter should be coming from your heart but always professional looking. Find common ground between you and the business, and focus on that. Try avoiding cliches; give examples from your studies and experiences of why you are suitable for the given job. Or explain how you picture yourself growing in the company and how determined you are to do so. 

## Know when enough is enough

Whether making your CV for the first time or updating it, you should never forget that the point isn't to drown the recruiter in your life history. It is all about balance. Before submitting - ask yourself, did I pitch myself well enough? 


A focus on how to create a CV quickly, simply, and efficiently. 

Make your CV the Ultimate Winner

## What is SEO?

SEO stands for Search Engine Optimization and is a term that indicates whether your site appears at the beginning of search results in Google, Bing, Yahoo, etc. Getting to the top of the lists gives you an overwhelming proportion of the click-throughs while showing on page two means you have lost 99% of potential clients. [[statistic 31.]](https://www.impactplus.com/blog/seo-statistics)

## SEO market

As with many of the impactful technologies nowadays, SEO opened a new business niche and created a market for itself. The product is people's attention.

Every person on Google is a potential customer. They have an idea of what they want, they type it in and end up on your site. This dream scenario is the goal of SEO and the reason people pay experts. The results you get will either let your business flourish or end it.

In this article, we explore practical steps developers can take to either boost the SEO of an existing site or lay the proper foundations for a brand-new business. Either way, you can surely benefit from SEO knowledge as it is marketable and in demand.

## What can developers do?

It turns out that you - the developer, have a huge impact on SEO. There are many options before you, so allow me to narrow them down and list a dozen with the biggest impact.

### Must DOs

> **Make your site crawable**

Search engines visit your site via a crawling bot. You can think of it as an unregistered user that will only be able to see what a guest user can see. Any information meant for paying users will not be accessible nor taken into account when the bot scores your site. Be thoughtful and provide relative content free of charge so Google and Bing can actually have something to show of you.

> **HTTPS**

Please, get an SSL certificate. Not doing so is the quickest way to sabotage your website's discoverability as all modern browsers will prompt users not to trust your site unless the connection is secure. The reputation cost you pay will outweigh any and all optimizations you have done so far. This is a must.

### HTML

Crawling bots don't operate the way we do. They cannot look at pictures and decide whether they are helpful. They neither watch nor listen to videos. Bots rather read the source code of the site and do their scoring based on its structure and semantics. HTML is in their blood and hopefully in yours too.

> **Page title**

The page title is of primary importance [[statistic 18.]](https://www.impactplus.com/blog/seo-statistics). It is set via the `<title>` tag and provides the name of your pages and the titles of search results in Google.

You must make sure that all resources in your platform have an identifier that can be used as a page title.

**Pro tips:**
- keep titles 50-60 characters long
- keep it simple, unique and try to use keywords

> **Description**

Descriptions are texts that appear below the titles of search results. They provide additional information and can boost your position and click rates as keywords are bolded and indicate that your site is relevant.

![Meta description Lexis Solutions](//images.ctfassets.net/5gydaotbo8jm/4HW1R7VBnHsCtcbqBO2pDG/20480cd37c99df19dc53064558ba58d4/meta_description.jpg)

You can hardcode descriptions for index pages, however, you should lay the groundwork and have a separate column when it comes to show pages. Talk it through with your client and leave an input field that admins populate upon document creation.

From a developer standpoint providing the meta description is easy. Add `<meta name="description" content="...">` to the `<head>` element.

**Pro tips:** 
- aim for a sentence or two (~150 characters) 
- make it descriptive and in sync with your content 
- use keywords and avoid duplication of meta descriptions 
- differentiate by adding an emoji - the color will set you apart and attract clicks; take a look:

![fire emoji](//images.ctfassets.net/5gydaotbo8jm/5YBhlpi8GF62MvrEHWAzVH/b0901fb2ba24c62a94ecf06229d8aa7f/image.png)

> **Headings**

Heading tags have a built-in hierarchy. The top-level heading is `<h1>`, followed by `<h2>`, `<h3>`, and so on to the lowest - `<h6>`. The proper usage of headings outlines the structure of your text and helps readers scan it quickly. Whenever a heading catches the attention of a visitor, they will surely spend time on your site and improve its rating as Google takes into account the duration of page visits.

**Pro tip:**

Set up your project for success by designing your DB schemas in a manner that allows and guides admins into providing titles, subtitles, lists of questions and answers, etc. that can be transformed into a hierarchy of headings. Such information will prove useful for other SEO practices too.

> **nav tags**

Bots treat the HTML at the top of the source code as the most important and lower the significance of tags found later. This means that any headers at the top of the site could greatly influence the scoring of your pages even though they are duplicate content. That is unless you surround them with `<nav>` tags. When you do that you indicate to crawlers that this content is for navigational purposes and serves to improve the usability of the site.

> **Structured data**

Structured data is a JSON that you put inside of a `<script type="application/ld+json">` tag. It speaks directly to bots and explains to them what the page they are currently crawling is all about. Structured data also serves as a suggestion of how search engines should display the data.

Try searching for "how to roast a potato" on Google.

![SERP example - how to roast a potato](//images.ctfassets.net/5gydaotbo8jm/6XQqaS0m9YIq5xQT7KiFdR/5e263bd42b5a78d827853d17567007e3/how-to-roast-a-potato.jpg)

Now try "largest volcano".

![SERP example - largest volcano](//images.ctfassets.net/5gydaotbo8jm/6HfiTZ4TAvn5jONQHg7jVm/62bb705f7a7fe9b20692c2e61340d39c/largest-volcano.jpg)

Sometimes Google crawls credible sources that have well-written structured data, understands what the data represents, and uses it to show default answers for specific searches. As long as the site follows the official markup listed at Schema.org search engines are able to differentiate facts, recipes, people, places, organizations, etc.

> **Open Graph**

OpenGraph was first introduced by Facebook and provided a way to share links and get a nice preview. In time, tech companies adopted the `og:` meta properties and OpenGraph became the norm. Here is what you get for a few lines of code:

![OpenGraph - lexis.solutions](//images.ctfassets.net/5gydaotbo8jm/23tUxXpKSARpNwP7sK1PI7/76e9f0542a6451d4a43f7a4dffa01f75/OpenGraph_-_lexis.solutions)

You can check all available meta data properties, how, and when to use them [here](https://ogp.me). The fundamental ones that you should know are *title*, *description*, *type,* and *image*. They are added to the `head` element like this:

1. `<meta property="og:title" content="Lexis Solutions - Your Ideas, Our Solutions."/>`
2. `<meta property="og:description" content="Lexis Solutions is a software agency..."/>`
3. `<meta property="og:type" content="website"/>`
4. `<meta property="og:image" content="..."/>`

__Pro tips:__
- make *og:title* and *og:description* the same as the page title and the meta description 
- music and video have dedicated meta data properties 
- Twitter have their own standard

> **Canonical URL**

Sometimes you have duplicate content on multiple pages. The crawling bots of Google will realize that and show only page in the search results. If you want to pick which one that should be you can specify a canonical URL. It's as simple as adding a new `meta` tag and it will allow for multiple pages to collect a joint reputation. The code is added to `head` element like this: `<link rel="canonical" href="https://lexis.solutions/" />`

**Example:**

Let's talk about calendars. The thing with calendars is that the new ones should dethrone the old ones, SEO-wise, immediately. This is easily achieved by taking advantage of canonical URLs, and we have tested it! Generate the URL for the newest calendar and have all calendars point to it "canonically". This way you seamlessly transfer the reputation and appear at the top of Google.

> **robots meta tag**

You can tell crawlers whether to index your pages, follow links, show images in the search results or ignore your page completely. Actually, they understand a broader range of commands that you can read [here](https://moz.com/learn/seo/robots-meta-directives).

In my estimate, the ones you need to know are *noindex*, *nofollow*, and n*one*.

*noindex* instructs bots that the current page should not be shown in search results. *nofollow* indicates that you do not trust and do not wish to be associated with links on the current page. 
*none* combines both *noindex* and *nofollow*.

Your preferred directive is added to the `head` element like this `<meta name="robots" content="...">`

> **img alt**

Bots don't analyze images and fully rely on the `alt` attribute to make sense of pictures. All `img` tags in your project should include alternative information like this: `<img src="photo.jpg" alt="description">`

**Pro tip:**

Provide a relative description as the alt attribute. It does count and will increase your SEO rating. 
Bear in mind that setting false or misleading descriptions may get you penalties.

## Conclusion

By now you should have a basic understanding of the importance of HTML structure and semantics. This knowledge alone should get on the right path. 

Your next steps should be aimed at optimizing load speeds, providing sitemaps, resource schema and utilizing some of the tools available out there. Go read and learn more on the topic through the follow-up article on SEO!

SEO is straightforward for developers - follow a few basic principles, optimize your code, aid crawlers and use tools to help you at every step. 

SEO for Developers - Part One

Hiring junior-level talents has always been a challenge. It is no coincidence that many software academies have appeared to try and ease the hiring process of beginner-level developers. However, it is always the company's responsibility to bring their new colleagues into their culture, processes, and conventions.

In that regard, we are happy to have developed an excellent mentoring system that has proven effective and gained positive feedback from the trainees.

I will share the main points of focus for the duration of our mentoring program.

## Time frame

The time needed depends on the experience level of the trainee. Generally, **3 to 6 months** is the standard period for a young colleague to reach a competent skill and confidence level to participate in larger tasks as part of a team.

## Points of focus

We have divided our mentoring program into four main parts that develop problem-solving skills and simulate real work experience. In the end, it is expected that we cover the following aspects: 

-   Going through the software development cycles

-   Working comfortably with git

-   Following code conventions and simple code practices

-   Dealing with unexpected requirement challenges

*With that in mind, here are the four main focus points:*

### 1\. Solve algorithmic problems and go through a pre-selected course

Depending on the level of experience of the colleague, this part could take from a couple of weeks to more than a month. The main idea is to practice problem-solving skills in a particular language and get familiar with git and the command-line interface. 

### 2\. Solve a non-trivial algorithmic problem

This phase is pivotal in our mentoring program. We pick a more significant task involving working with a more complicated data structure, for example, a graph. During this task, the trainee must also implement a custom variation of standard algorithms like depth-first or breadth-first search. 

By the end of this phase, we have a working console application and are ready to move into a more real-world setting. It usually takes up to a month to reach this point.

### 3\. "Apify" our console application

This is where we introduce a more structured approach to software development. We attempt to simulate an actual project setup and present common challenges in that scenario.

The goal is for the trainee to expand their [API](https://www.lexis.solutions/blog/how-to-test-REST-ful-APIs-with-postman) development [knowledge ](https://www.lexis.solutions/blog/why-does-knowledge-matter)with a concrete tech stack. To help with that, we provide courses as an additional resource, but we prefer hands-on experience, so we give out an initial API project structure that needs to be followed down the line. 

The first task we set is integrating our previous console application into the RESTful API project. This provides a good challenge for less experienced developers because they need to shift their way of thinking in the context of [HTTP](https://www.lexis.solutions/blog/beginner-frienly-http-requests) communication. They start to handle aspects such as: 

-   parameter validation

-   state management

-   [HTTP](https://www.lexis.solutions/blog/beginner-frienly-http-requests) methods

-   CORS

After that, we expand our project with additional features that introduce working with databases, authentication, and authorization.

An important notice here is that the new [developer](https://www.lexis.solutions/blog/who-runs-the-world-programmers) gets introduced to an ORM framework at a later stage, so they can realize and better understand the benefit it provides.

Another critical approach we use is to simulate requirement changes. So once the developer is done with the main API features, we plan a new set of features that require some refactoring. This is a good practice for the real world, where clients often have second thoughts, demonstrating the value of keeping a clean code convention.

We often dedicate a long time to this phase of our mentoring program as it creates a reasonable basis for work habits and introduces feature planning and code review processes.

### 4\. Work on an internal project or build a front-end solution

At this point, our young colleague is ready to take on more responsibilities in a team. Depending on their interests, the trainee could take on a role on an internal company project as a back-end developer or work on his front-end skills. 

Our front-end phase is quite similar to the API development phase described above. It directly consumes the REST endpoints and focuses on the React tech stack. The main points of focus include: 

-   CRUD cycles

-   React state management (redux and hooks)

-   Front-end validation and response management

-   Authentication handling

## Conclusion

So far, we have multiple colleagues who underwent our mentoring program and successfully joined some of our teams. Judging by our experience, it is essential to offer a challenge and bring it close enough to the real-world application to keep the trainee’s interest and involvement. We know the necessity of practicing problem-solving skills, but we also learned to integrate them into a bigger-scale learning project, and with the feedback and success we have gotten so far, it seems we have found the right strategy.

The following article describes how we developed a system for integrating intern and junior-level colleagues into our existing work processes

Tips for mentoring Junior-Level Developers

## Lexis Solutions decided to hit the Greek road at the beginning of September. 

Just a month after [Lexis turned 5](https://www.lexis.solutions/blog/5-years-lexis-solutions-rooftop-party), its team gathered together on Thassos island. In 3 days, the teammates not only got closer but immersed themselves in the Greek culture by enjoying the beautiful beaches, the traditional food, and dancing to its music.

![Lexis' Team-taverna](//images.ctfassets.net/5gydaotbo8jm/1OZC9GoJ8gc4W78EITnmz4/a5f3095cb5ab70a9d7687e678ef09e00/20220903_215950.jpg)

We knew Lexis's team and some of their loved ones; five cars and a 6.5-hour journey demanded careful preparation. So, we got up early and left Sofia before the morning traffic jammed the streets. Neither the rain nor the waiting at the border could sink our spirits. But what about the ferry? 

## Is the ferry scary?

Firstly, it took some configuration, who should travel in whose car, but finally, Lexis' team started approaching its first aim - the ferry. Surprisingly some of us hadn't been on a ferry before but soon realized it was not that scary. And after all, you can observe all the beauty around it.

![Ferry-view](//images.ctfassets.net/5gydaotbo8jm/1XHe2knWcvqaiVhSjtssoS/dc14dc536125904ffb27ca0fcbc0a73f/20220904_151506.jpg)

After a few fun hours, Lexis Solutions safely arrived at Mon Avis Boutique hotel, which Bulgarians ran to our surprise. We did book 75% of the hotel, so you can say we had a private pool.

![Dilyan na hotela](//images.ctfassets.net/5gydaotbo8jm/3FSz2fYANcTtOPNpIWmNFr/e037c86a8120ff76c693c0a9d8c368de/IMG_1245.jpg)
![baseina, v koito taka i ne vlqzohme](//images.ctfassets.net/5gydaotbo8jm/4dhKHnPQTzuQooUUxQjxns/1f174ed37318688980b2af68d6e872c7/20220902_192447__1_.jpg)
![Bilyal chok gyzar](//images.ctfassets.net/5gydaotbo8jm/1wrt8e7FA9gPkKkx8YNt0D/8f0da3c04171396c57637ad1eaad0deb/IMG_1244.jpg)

## From developers to real volleyball stars 

It took us one visit to a Thassos beach to realize that real volleyball stars are hiding inside our developers' hearts. For the whole vacation, the typical yellow ball never left our hands. So the game became crucial in our team building. 

![voleybolnite zvezdi na lexis](//images.ctfassets.net/5gydaotbo8jm/1b39St46KQAWlNcth4Q8Nc/bbc03dd84cfe1a4af074ab29c738622b/20220904_134139.jpg)
![voleybolni zvezdi v moreto HD](//images.ctfassets.net/5gydaotbo8jm/10rkn37N4uQueaXZfMUk2y/5b48acf896531387782967715ecd132b/image.png)

## 1, 2, 3... Jump!

The famous Thassos place, Giola tested Lexis' team's bravery. Even though some just observed, others didn't hesitate to jump from quite the distance into the sea!

![vsqka jaba da si znae giola](//images.ctfassets.net/5gydaotbo8jm/12QPBs8uX4JmrtMd9qRQw8/feb27d8d94413a789be076b68b1a4f4f/20220903_105633.jpg)
![skachameeee](//images.ctfassets.net/5gydaotbo8jm/1ySjk183vXjdGt0bwzq6L9/9b76b8151de25cdd74bc64ea7543ac6a/20220903_122254.jpg)

## Shrimps here, calamari there

But what is Greece without its typical delicious cuisine? We visited two fantastic local tavernas, where we tried a bit of everything. 

![krasivi](//images.ctfassets.net/5gydaotbo8jm/2cYbkTheJs3FktspWOlgkb/6386ca2bab813b66a050b5b18497379d/20220902_204051.jpg)
![pak krasivi](//images.ctfassets.net/5gydaotbo8jm/2l6zk8ihivt80WUvnVgO9n/fc264aaaa970c274571ff32c26534840/20220902_203830.jpg)

## Yes or no? 

Except for all the eating, we spent our evenings getting to know each other by playing different games. Even though one game (which we will keep for ourselves) confused pretty much everyone and made some laugh, others mad, in the end, it got us closer than ever.

![Viktor i Ivan ot Stara Zagora](//images.ctfassets.net/5gydaotbo8jm/5jDm7YYc0WNxRpBRcRl3yq/77b156c9d45500921d1958a84b349cfe/20220904_001247.jpg)

They say when you are with the right people, the time passes faster. Definitely, the 3 days Lexis Solutions spent at Thasos island felt like more like 3 hours. 

![lexis bez Nikola i Dilyan, koito ni izostaviha](//images.ctfassets.net/5gydaotbo8jm/7yJ7tcaXpqYdGWClzoAbjD/f4d03152de02868bc1add1aff35121e9/Copy_of_DJI_0119.JPG)
![nomer 1,2,3,4](//images.ctfassets.net/5gydaotbo8jm/5CGKfFcqdy8yg1D8fjsyK9/8710e450da9522f68abf5d312fe243d2/20220904_113204.jpg)


Lexis Solutions is exploring Thassos island. 

From the front lines